传单传奇不按预期工作

时间:2015-06-25 00:48:07

标签: javascript css leaflet

系列中一个图层的图例未显示所有颜色,我无法找到原因。

我很困惑。我现在已经做过一些传说,现在正在处理一个应用程序,而这个传奇根本不会表现出来。

图例不会拾取任何其他颜色,而是一个所有正方形都是相同的颜色。我已经检查并重新编码了很多次。我不得不失去其他一些东西。我已经用我的数据中的样本做了一个jsfiddle进行测试,我很惊讶地看到它在那里做同样的事情。

是什么导致这种情况?

JSFiddle

代码示例:

//Get color for Index
function getColorInd(d) {
    return d >= 0.51 ? '#7a0177' : 
    d >= 0.44 && d <= 0.50 ? '#c51b8a' : 
    d >= 0.33 && d <= 0.43 ? '#f768a1' : 
    d >= 0.16 && d <= 0.32 ? '#fbb4b9' :
    '#feebe2';
}

[...]

var legend = L.control({position: 'bottomright'});
legend.onAdd = function (map) {

    var div = L.DomUtil.create('div', 'info legend'),
        labels = ['<strong>index</strong>'],
        lower = [0, 0.16, 0.33, 0.44, 0.51],
        upper = [0.15, 0.32, 0.43, 0.50, 0.68];

    for (var i = 0; i < lower.length; i++) {
        div.innerHTML += labels.push(
            '<i style="background:' + getColorInd(lower[i] + 1) + '"></i> '+
            lower[i] + '&ndash;' + upper[i]);
    }
    div.innerHTML = labels.join('<br>');
    return div;
};

legend.addTo(map);

var geojson = L.geoJson(Sample, {
    style: styleInd,
    onEachFeature: onEachFeature
}).addTo(map);

1 个答案:

答案 0 :(得分:1)

你犯了一个逻辑错误。

您正在使用getColorInd(lower[i] + 1)

将其替换为getColorInd(lower[i])

表示只需从function中移除 +1 ,即可正常使用。

这是更新后的fiddle