Question

我正在摆弄Leaflet choropleth example，尝试弹出一个弹出窗口，显示每个州的名称和自己的URL，这些都写在varStates json中。

在我的本地示例中，我将每个州的名称和URL作为属性，但我无法获取.bindPopup来引用json中的props。它只能显示＆＃34;＆＃34;。

中的文字

我的例子是：jsfiddle.net/yLa4acvy/1/

我试过像

这样的东西

    .bindPopup( props.name + "<br> <a href='localhost/'" + props.url_id + "'>This company</a>")

但即使我为属性创建新变量并引用它们，也无法使其工作。

编辑：我找到了一个mapbox解决方案，但我仍然想知道如何在传单中做到这一点：https://www.mapbox.com/mapbox.js/example/v1.0.0/custom-marker-tooltip/

Answer 1

正如我在之前的评论中所提到的，你必须在onEachFeture函数中绑定弹出窗口，如下所示：

L.geoJson('data', {
    onEachFeature: function(feature, layer) {
        layer.on('click', function() {
            //you bind the popup here, you can acces any property of your Geojson with feature.properties.propertyname
            layer.bindPopup('<p>' + feature.properties.name + '</p><p>' + feature.properties.density + '</p>').openPopup();
        });
    }
});

这是一个更新的JSFiddle，演示了这个： http://jsfiddle.net/yLa4acvy/2/

如何在Leaflet.js中显示每个等值区域弹出窗口的唯一名称和URL

1 个答案: