Листовка Легенда не отображается

Question

Может кто-то сказать, что не так с кодом? Легенда, которая, как предполагается, самая легкая часть, которая не появляется, и я не могу понять, почему. Может быть, скрыт в каком-то другом слое?

После GetColor и легенды код

var legend = L.control({ 
    position: 'bottomleft' 
}); 

legend.onAdd = function(map) { 
    var div = L.DomUtil.create('div', 'info legend'), 
    grades = [0.2, 0.26, 0.32, 0.38, 0.44, 0.5, 0.56, 0.62, 0.68, 0.74, 0.8, 0.86, 0.92, 0.98, 1.04, 1.1], 
    labels = [], 
    from, to; 

    for (var i = 0; i < grades.length; i++) { 
    from = grades[i]; 
    to = grades[i + 1]; 

    labels.push(
     '<i style="background:' + getColor(from + 1) + '"></i> ' + 
     from + (to ? '&ndash;' + to : '+')); 
    } 

    div.innerHTML = labels.join('<br>'); 
    return div; 
}; 

Answer 1

EDIT следующие комментарии Ответ:

использования инструментов разработчика (F12/на Mac: Cmd + Alt + I), чтобы прочитать потенциальные ошибки консоли.

В вашем случае функция getColor не определена в пределах вашего legend.onAdd.

Кроме того, вы добавляете 1 в значение from, в результате чего значения варьируются в [1.2 - 2.1], тогда как ваша функция getColor использует значения от 0,26 до 1,1.

Работа демо используя код из репозитория: http://plnkr.co/edit/lbKlXaV76t6NclHQPCtr?p=preview (getColor скопирована в правильном объеме, и удаляют +1 в getColor(from + 1))

---

Оригинальный ответ:

ли вы добавить свой собственный контроль на карте ?

legend.addTo(map); 

В качестве примечания, ваш <i> тег с легендой-эд цвет фона из getColor не имеет никакого содержания. Поэтому вы, вероятно, увидеть не окрашенного содержание ...

Demo: http://jsfiddle.net/3v7hd2vx/34/ (с фиктивным содержанием в вашем <i> теге)