如何用小冊子使用MarkerCluster更新彈出窗口內容

我試圖展示一個帶有很多標記的地圖（~36000），它必須包含一些信息。如何用小冊子使用MarkerCluster更新彈出窗口內容

首先，我從一個數據庫中獲取元素，然後使用PHP將它編碼到JSON數組中，然後使用JSS獲取它，最後將其添加到我的地圖中，並將彈出式菜單的內容設置爲JSON數組。

問題是，有太多的數據，PHP引發致命錯誤：Allowed memory size of 134217728 bytes exhausted。

我認爲我可以做的立交這是爲點擊每個彈出一個SQL請求。就這樣，我將不得不從我的數據庫加載一些數據（只是緯度，經度和ID知道在哪裏SELECT之後），所以它不會拋出Fatal Error

因此，這是現在的作品。

var map = L.map('map', {center: latlng, zoom: 9, zoomControl:false, layers: [tiles]}); 
var addressPoints = JSON.stringify(<?php echo $data; ?>); 
var arr = JSON.parse(addressPoints); 
var markers = L.markerClusterGroup(); 

for (var i = 0; i < arr.length; i++) { 
    var marker = L.marker(new L.LatLng(a[0], a[1]), { title: my_title }); 
    marker.bindPopup("contains the ID in order to SELECT"); 

    markers.addLayer(marker); 
} 
map.addLayer(markers);

這是我想工作的想法（這是行不通的，這是一個摘錄我把在互聯網上）。

marker.on('mouseover', function(){ 
    $(popup._contentNode).html('content made by PHP after the SELECT request'); 

    popup._updateLayout(); 

    popup._updatePosition(); 
});

問題是我不知道如何訪問一個特定的標記（當點擊它），既不是被綁定到它的彈出窗口。

我可以幫忙嗎？

來源

2017-05-24 toximorph

在處理使用this變量，如下所示：

marker.on('click', function() { 
    // load popup's content using ajax 
    var popup = L.popup() 
     .setLatLng(this.getLatLng()) 
     .setContent("Loading ...") 
     .openOn(MY_MAP); // replace to your map 

    $.ajax({ 
     // ... options 
     success: function (data) { 
      popup.setContent(data); 
     } 
    }); 
});

在http://leafletjs.com/reference-1.0.3.html#popup-on

來源

2017-05-24 12:01:18 maximkou

感謝查看詳情，這是第一步！我沒有看到正確的文檔。對我來說，下一步是找到一種方法來獲取當前彈出窗口（包含ID）的內容，並用PHP/SQL生成的新窗口進行更改。我不會再說一些幫助 – toximorph

@toximorph，我更新答案。這是使用ajax打開標記點擊彈出窗口和加載彈出窗口內容的示意圖。 – maximkou

完美的作品，非常感謝你！ – toximorph

如何用小冊子使用MarkerCluster更新彈出窗口內容

回答

相關問題