OpenLayers 6 + Angular 8：LineString(s) 未显示在矢量层上（没有来自 JS 的错误）

Question

我遇到了一个问题，我的 LineString(s) 没有显示在地图上，控制台也没有给出任何错误。

我相信我的代码是正确的，但我对 OpenLayers 不是很了解，我可能是错的。

这就是我将矢量图层添加到地图的方式

var vectorLayer = new ol.layer.Vector({
      name: 'trailLayer',
      type: "Vector",
      source: new ol.source.Vector({ format: new ol.format.GeoJSON({ featureProjection:"EPSG:3857" }) }),
      zoomMin: 8,
      zoomMax: 18
    });

    this.map.addLayer(vectorLayer);

这就是我添加新 LineString 的方法

let layer;
this.map.getLayers().forEach(function (value) { if ( value.get('name') === 'trailLayer') { layer = value; } });
if(layer == null) { return; }

let coords = [[latA, lonA], [latB, lonB]];
let lineString = new ol.geom.LineString(coords);
lineString.transform('EPSG:4326', 'EPSG:3857');

var lineFeature = new ol.Feature({
    name: callsign,
});

lineFeature.setGeometry(lineString);


var lineStyle = new ol.style.Style({
    stroke: new ol.style.Stroke({
        width: trailWidth,
        color: trailColor
    })
});

lineFeature.setStyle(lineStyle);

layer.getSource().addFeature(lineFeature);

如果我尝试使用 source.GetFeatures() 它会正确显示我的所有功能，但我无法在地图上看到它们。

我是不是漏掉了什么？

P.S。每个变量都被正确分配，没有什么奇怪的，也没有未定义的 ecc...

Answer 1

在 OL 中坐标必须先 expressed 作为经度，然后是纬度。

尝试交换坐标：

let coords = [[lonA, latA], [lonB, latB]];

OpenLayers 6 + Angular 8：LineString(s) 未显示在矢量层上（没有来自 JS 的错误）

OpenLayers 6 + Angular 8 : LineString(s) not showing up on Vector Layer (With no errors from JS)

javascript

openlayers

typescript

angular

openlayers-6