使用Leaflet Marker在单击事件时向文档添加文本

时间:2017-08-27 12:56:57

标签: javascript leaflet

我正在使用Leaflet,我想这样,当用户点击标记时,文本将显示在地图旁边,其中包含已点击内容的完整描述。弹出窗口已经出现了标记的简短描述,但我也想要更长的描述。它应该很简单,除了我无法弄清楚如何正确引用标记。

L.geoJSON(geojsonFeature, {
  onEachFeature: onEachFeature
}).bindPopup(function(layer) {
  return layer.feature.properties.popupContent
}).on('click', markerOnClick).addTo(map);

function markerOnClick(e) {
  document.getElementById("text").innerHTML = (this.options.properties.description);
}

所以我可以用这个来回答我自己的问题 -

        function markerOnClick(e)
{        document.getElementById("text").innerHTML=e.layer.feature.properties.description;}

1 个答案:

答案 0 :(得分:0)

您不是通过执行此操作将方法添加到每个标记。你需要用另一种方式来做:

// It will add the method on click on each layer of your GeoJson
function onEachFeature(feature, layer) {
    layer.on('click', function (e) {
    document.getElementById("text").html(e.layer.feature.properties.description);
    });

}

geojson = L.geoJson(geojsonFeature, {
    style: style,
    onEachFeature: onEachFeature
}).bindPopup(function(layer) {
        return layer.feature.properties.popupContent
}).addTo(map);

进入function (e)您应该控制台记录变量e以查看您是否可以使用e.layer.feature.properties.description

访问您的数据