首页 > 解决方案 > 从 Db 构建多个工具提示

问题描述

我正在将我目前的地图脚本从 Google 转换为 Leaflet。我有一个包含 5 个图层的地图,每个图层都有多个存储在 Db 表中的位置。我在这个过程中有两个例程。第一个从 Db 收集数据并构建传递给第二个的 XML 文件。第二个然后解析 XML 文件并构建单独的 L.marker 内容,如下所示:

for (var i = 0; i < numMarkers; i++) {
    var mkrType = markers[i].getAttribute("type");
    var mkrName = markers[i].getAttribute("name");
    var mkrLat  = markers[i].getAttribute("lat");
    var mkrLon  = markers[i].getAttribute("lon");

    var mkrIcon = "files_images/mis_images/icon_tri_green.png"; break;

    var mkrText = "<b>" + mkrName + "</b><br>Lat:&nbsp;" + mkrLat + "&nbsp;&nbsp;Lon:&nbsp;" + mkrLon;
    L.marker([mkrLat, mkrLon], {icon: mkrIcon}).bindPopup(mkrText).addTo(cemeteries);
}

该脚本在 for 循环 (L.marker) 的最后一行产生 (Uncaught TypeError: t.addLayer is not a function)。

我认为错误在于循环/L.marker 在函数内。如果是这样,我如何以及如何传递使代码正常工作所需的内容。

TIA 提供任何帮助

杰达威尔逊

标签: bindingleafletmarker

解决方案


您的图层cemeteries未定义。

您可以使用var cemeteries= L.featureGroup().addTo(map). 在循环之前添加此行。

然后您的代码应该可以工作并且标记会显示在地图上

更新

您将标记添加到字符串而不是图层对象。(我不知道是什么**lyrName[i]**,但它不起作用......)

尝试:

var lyrName = ["cemeteries", "churches", "markers", "schools", "towns"];
var lyrObjs = [cemeteries, churches, markers, schools, towns];
var lyrType = ["cem", "chu", "mkr", "sch", "twn"];

//...

L.marker([mkrLat, mkrLon], {icon: mkrIcon}).bindPopup(mkrText).addTo(lyrObjs[i]);

推荐阅读