如何使用带有传单的标记群集更新弹出内容

Question

我正在尝试显示一张地图，上面有很多标记(~36.000)，这些标记必须包含一些信息。

首先，我从数据库中SELECT元素，然后使用 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();
});

问题是我不知道如何访问特定标记(单击它时)，也不知道如何访问绑定到它的弹出窗口。

我可以得到一些帮助吗？

Answer 1

在处理程序中使用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