javascript - 向交互式 Leaflet choropleth 添加更多值

Question

我正在尝试在此示例 Leaflet choropleth map 的交互中添加更多组件。我想显示州的名称，一个总值(这是用于颜色等值线的值)+ 总值分为两个值(例如人口总数、男性人口、女性人口)。

示例:https://leafletjs.com/examples/choropleth/example.html

除了 .js 文件中的“名称”和“密度”之外，我似乎无法在 map 上显示其他值，当我尝试添加新值时它只显示为“未定义”:

info.update = function (props) {
        this._div.innerHTML = '<h4>Population US</h4>' +  (props ?
            '<b>' + props.name + '</b><br />' + 'Total population: ' props.density + '</b><br />' + 'Male population: ' + props.pop_male
            : 'Hover over a state');
    };

有什么建议吗？

Answer 1

如果您使用与示例中相同的数据，则从此处加载 statesData:statesData.js

在这种情况下，唯一可用的属性是“名称”和“密度”。如果您想显示其他信息，则需要提供您自己的 statesData featureCollection 以及其中的额外属性。