0

我正处于我早期的 OpenLayers 学习周期中,感觉有点失落。加载页面时一切正常;也就是说,我有许多ol.Feature对象被创建(来自 JSON 文件)并在地图上正确呈现。

ol.Feature当我尝试将其他对象添加到地图时,会出现我遇到的问题。无论如何,一切在内部看起来都是正确的 - 该ol.Feature对象只是没有出现在地图上。

以下是用于创建 Map 的 BASE JS 代码:

var map = new ol.Map({
  target: 'map',
  controls: ol.control.defaults().extend([mousePositionControl]),
  interactions: defaultInteractions().extend([new Drag()]),
  layers: [ baseMapLayer],
  view: new ol.View({
          center: ol.proj.fromLonLat([-70.681715, 19.779147]), 
          zoom: 16 //Initial Zoom Level
        })
});

var vectorSource = new ol.source.Vector({
  features: [marker, marker_2]
});
var markerVectorLayer = new ol.layer.Vector({
  source: vectorSource
});

map.addLayer(markerVectorLayer);

以下是用于创建单个ol.Feature对象的代码块:

function addMapMarker(sMid, sDid, sLong, sLat)
{
    var marker = new ol.Feature({
        geometry: new ol.geom.Point(ol.proj.fromLonLat([sLong, sLat]))
        //geometry: new ol.geom.Point(ol.proj.transform([sLong, sLat], 'EPSG:4326', 'EPSG:3857'))
    });

    marker.setId(sDid);

    marker.setStyle(new ol.style.Style({
        image: new ol.style.Icon(({
            crossOrigin: 'anonymous',
            src: 'img/ent_mkr/' + sMid
        }))
    }));

    return marker;
}

在初始页面加载期间,每个ol.Feature对象都添加到名为“aFeatures”的 ARRAY 对象中:

var aFeatures = [];

此代码在“forEach”循环中运行,因为它从 JSON 文件中提取数据:

aFeatures.push(addMapMarker(sMarkerId, oEntitiesData.did, oEntitiesData.lon, oEntitiesData.lat));

一旦“forEach”循环完成,“aFeatures”数组就会被添加到ol.source.Vector对象的“features”属性中:

vectorSource.addFeatures(aFeatures);

到目前为止很好- 当我尝试将其他ol.Feature对象添加到ol.Map(一一添加)时,就会出现问题。我基本上遵循与上述相同的例程,使用对 addMapMarker 函数的调用来创建一个新ol.Feature对象:

var oMapMkr = addMapMarker(sMid, oEntitiesData.did, oEntitiesData.lon, oEntitiesData.lat);

然后将其添加到ol.source.Vector对象中的“功能”属性中:

vectorSource.addFeature(oMapMkr);

问题是:毕竟,该ol.Feature对象没有出现在页面上。在对象上调用render()orrenderSync()函数ol.Map没有帮助。

最后 - 我知道额外的帖子页面加载ol.Feature对象被添加到 markerVectorLayer,因为我逐步完成了它:

markerVectorLayer.getSource().getFeatures().forEach(function(item, index)

我怀疑我遗漏了一些非常明显的东西,但我只是不知道那是什么 - LOL 谢谢你的帮助!

4

1 回答 1

0

碰巧,伙计们,当我以以下方式结束最初的问题时,我是 100% 正确的:

我怀疑我遗漏了一些非常明显的东西,但我只是不知道那是什么 - 哈哈

我创建的代码很好,我的问题确实很基础,与我发布的内容无关。我尝试使用的 PNG 图像ol.style.Icon已损坏,因此实际上没有下载到页面。我在 Firefox 调试器中检查网络显示后才发现。

这个问题可以被认为是关闭 - 谢谢!

于 2020-03-10T17:39:40.470 回答