Javascript Openlayers 5图标未显示在地图上

Javascript Openlayers 5图标未显示在地图上,javascript,html,openlayers,openlayers-5,Javascript,Html,Openlayers,Openlayers 5,我正在使用OpenLayers 5创建一个带有图标的简单地图。我遵循了这一原则,它是有效的。现在,我更改了数组中的源数据。例如,我有四个点要在地图上显示 window.locs = [{ "y": "52,51241", "x": "13,38961" }, { "y": "52,52107", "x": "13,38773" }, { "y": "52,52488", "x"

我正在使用OpenLayers 5创建一个带有图标的简单地图。我遵循了这一原则,它是有效的。现在,我更改了数组中的源数据。例如,我有四个点要在地图上显示

window.locs = [{
        "y": "52,51241",
        "x": "13,38961"
      }, {
        "y": "52,52107",
        "x": "13,38773"
      }, {
        "y": "52,52488",
        "x": "13,40369"
      }, {
        "y": "52,54902",
        "x": "13,41655"
      }];
我只更改了创建向量源的部分,从手动逐个设置改为使用循环

for (var i in window.locs) {
    var data = window.locs[i];
    iconFeature = new ol.Feature({
            geometry: new ol.geom.Point(ol.proj.fromLonLat([parseFloat(data.x.replace(",", ".")), parseFloat(data.y.replace(",", "."))]))
        });

    iconFeature.setStyle(new ol.style.Style({
            image: new ol.style.Icon(/** @type {module:ol/style/Icon~Options} */({
                    color: [113, 140, 0],
                    crossOrigin: 'anonymous',
                    src: 'https://openlayers.org/en/v3.20.1/examples/data/dot.png'
                }))
        }));
    window.iconFeatures.push(iconFeature);
}
var vectorSource = new ol.source.Vector({
        features: window.iconFeatures
    });
不幸的是,图标没有显示在地图上。如果不使用循环,将显示图标。我有很多数据,无法逐个赋值

这是我的JSFIDLE:


如何解决此问题?

需要将图层添加到地图中

map.addLayer(vectorLayer);

你的小提琴需要map.addLayervectorLayer;除此之外,它似乎工作正常。非常感谢。为什么他们不在示例中使用“addLayer”?那里没有关于它的解释。你能把这个作为答案发表吗?地图是在图层之后创建的,这样两个图层都可以包含在设置中。嗨@Mike,你能把你的评论作为答案发表吗,这样我就可以接受了?