javascript - 在弹出窗口中显示来自 GeoJson 的信息 (LEAFLET)

Question

我正在为拥有 Trails 的公司编写程序。该程序显示了一个带有长路径(连接所有路径)的网络 map 。我还通过从 GeoJson 数组读取坐标来在每个小道起点上显示标记。我想将弹出窗口绑定(bind)到每个标记，至少在弹出窗口中显示每个 trailhead 的名称。我尝试了很多东西，但没有任何效果。我现在将链接我当前的 HTML 文件和 GeoJson 文件。

GeoJson TrailHeaders File

Index.Html

Answer 1

需要修改GeoJSON()函数选项:

var trailheadsLayer = L.geoJson(trailheads, {
    onEachFeature: function(feature, layer){
        console.log(feature.properties);
        content = "Name: " + feature.properties.name + "<br>Abbreviation: " + feature.properties.abbreviati; 
        layer.bindPopup(content);
    }
}).addTo(map);

content 字符串可以用你需要的 json 属性进行修改。请小心并将字符串格式化为 HTML 元素。

你可以在这里看到一个 live version你的 map 。

附言。希望现在得到答案还为时不晚。