标记不会显示在地图上

时间:2019-10-10 15:47:28

标签: openlayers openlayers-5

我尝试使用OpenLayers制作第一张地图,但有一个问题,我在地图上没有任何标记...

但是我认为addMarkers函数无法正常工作,因为我只有地图,没有标记...

addMarkers: function () 
{
    console.log('addMarkers');

    for (var i = 0; i < this.listPlaces.length; i++) {
        var icon = this.getIconFunction('', this.listPlaces[i]);

        if (icon) {
            this.icons.push(icon);
        }
    }

    this.vectorSource = new ol.source.Vector({
        features: this.icons,
        extractStyles: false
    });

    this.vectorLayer = new ol.layer.Vector({
        name: 'Markers',
        source: new ol.source.Cluster({
            distance: 40,
            source: this.vectorSource
        }),
        style: function(feature) 
        {
            console.log('styleFunction');

            var img = RESSOURCES_PATH + '/images/icons/cluster.svg';
            var imgW = 70;
            var imgH = 70;
            var currentClusterHeight = Math.round(imgH);
            var currentClusterWidth = Math.round(imgW);
            var size = feature.get('features').length;

            if (feature.getProperties().features.length === 1) {
              var currentPoint = feature.getProperties().features[0];
              if (currentPoint.getProperties().marker) {
                img = currentPoint.getProperties().marker;
              }
            }

            var style = new ol.style.Style({
              image: new ol.style.Icon(({
                anchor: [currentClusterWidth / 2, currentClusterHeight / 2],
                anchorXUnits: 'pixels',
                anchorYUnits: 'pixels',
                src: img
              })),
              text: new ol.style.Text({
                text: size.toString(),
                fill: new ol.style.Fill({
                  color: '#fff'
                }),
              })
            });

            return style;
        }
    });

    // Add markers to map
    this.map.addLayer(this.vectorLayer);
},

在控制台中,我没有看到我的'console.log('styleFunction');',这是问题所在吗?

所有JS都在这里:https://0bin.net/paste/gR2zNZDsgh2sWwPm#RICq87ZHMDrNLaw9DapBgd4d9AVtfB2WlERTN2CuPu7

如果能为我做点事,请多谢。

0 个答案:

没有答案