【问题标题】:The geojson point data markers are not clustering in leaflet mapgeojson 点数据标记未在传单地图中聚类
【发布时间】:2019-10-21 04:23:48
【问题描述】:

我正在使用leaflet-markercluster 插件对我的点数据进行聚类。我已经将名为“街道”的 geojson 数据加载到地图中。该数据具有大约 40 个点及其各自的属性。我想将这些点聚集在传单地图中。但即使是标记也没有显示在我的地图上。请帮我找出错误。我的代码在这里:

var OpenStreetMap_Mapnik = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    maxZoom: 19,
    attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);

var street = {...my_geojson_data...}

var s_light_style = {
    radius: 8,
    fillColor: "#ff7800",
    color: "#000",
    weight: 1,
    opacity: 1,
    fillOpacity: 0.8
};


var markers = L.markerClusterGroup();
L.geoJSON(street, {
    onEachFeature : function(feature, layer){
        var popupContent =  '<h4 class = "text-primary">Street Light</h4>' +
                            '<div class="container"><table class="table table-striped">' +
                            '<thead><tr><th>Properties</th><th>Value</th></tr></thead>' +
                            '<tbody><tr><td> Name </td><td>'+ feature.properties.Name +'</td></tr>' +
                            '<tr><td>Elevation </td><td>' + feature.properties.ele +'</td></tr>' +
                            '<tr><td> Power (watt) </td><td>' + feature.properties.Power_Watt + '</td></tr>' +
                            '<tr><td> Pole Height </td><td>' + feature.properties.pole_hgt + '</td></tr>' +
                            '<tr><td> Time </td><td>' + feature.properties.time + '</td></tr>';
        layer.bindPopup(popupContent)
    },
    pointToLayer: function (feature, latlng) {
        return markers.addLayer(L.marker(latlng))  
    }
}).map.addTo(markers);

【问题讨论】:

    标签: leaflet geojson markerclusterer


    【解决方案1】:

    将代码替换为

    L.geoJSON(street, {
        onEachFeature : function(feature, layer){
            var popupContent =  '<h4 class = "text-primary">Street Light</h4>' +
                                '<div class="container"><table class="table table-striped">' +
                                '<thead><tr><th>Properties</th><th>Value</th></tr></thead>' +
                                '<tbody><tr><td> Name </td><td>'+ feature.properties.Name +'</td></tr>' +
                                '<tr><td>Elevation </td><td>' + feature.properties.ele +'</td></tr>' +
                                '<tr><td> Power (watt) </td><td>' + feature.properties.Power_Watt + '</td></tr>' +
                                '<tr><td> Pole Height </td><td>' + feature.properties.pole_hgt + '</td></tr>' +
                                '<tr><td> Time </td><td>' + feature.properties.time + '</td></tr>';
            layer.bindPopup(popupContent)
        },
        pointToLayer: function (feature, latlng) {
            return markers.addLayer(L.circleMarker(latlng, s_light_style))
        }
    })
    map.addLayer(markers);
    

    在上面的代码中,我指定了 map.addTo(markers)。但实际上我必须用“addLayer”替换“addTo”关键字。我必须添加图层。这样我就解决了geojson markerCluster的问题。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2019-09-02
      • 1970-01-01
      • 2014-07-10
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多