将范围列表转换为平面列表

Question

我正在尝试将一个以范围（1-2=蓝色、2-3=红色等）开始的图例列表的结构更改为一个扁平的单词列表（“blah”=blue，“ peek"=red)。

我遇到的问题是我需要找出一种方法来保持数字系统的位置，同时用文本替换该含义。此外，我需要相应的颜色在文本旁边，像这样......

(color)text<br>
(color)text<br>
(color)text

设置的地方是（这决定了颜色）

function getColor(d) {
    return d === 5 ? '#3e9936' :
    d === 4  ? '#9dcc00' :
    d === 3  ? '#f7ef00' :
    d === 2  ? '#ed5d13' :
    d === 1  ? '#ba212a' :
               '#a1a1a1';
}

这将显示在地图上并确定结构

legend.onAdd = function (map) {

    var div = L.DomUtil.create('div', 'info legend'),
        grades = [1,2, 3, 4, 5],
        labels = ["Pro-LEED","LEED-equivalent","No State-level","Anti-LEED","Anti-LEED Pending"],
        from, to;

    for (var i = "Pro-LEED"; i === labels.length; i++) {
        from = labels[i];
        to = labels[i];

        grades.push(
            '<i style="background:' + getColor(to + '"Pro-LEED"') + '"></i> ' +
            (/*only to check*/to ? to : 'br') +
            ((/*both to and from check*/from)?'':'') + 
            (/*only from check*/from ? from : '+'));
    }
    div.innerHTML = labels.join('<br>');
    return div;
};

现在我得到的只是一个文本列表，而不是每个单词旁边的颜色。

救命！

Answer 1

您可以使用哈希数组并直接查找值，无需函数：

var myData = [];
myData["Pro-LEED"] = "#3e9936";

...然后...

'<i style="background:' + myData["Pro-LEED"] + '"></i> '