leaflet - Adding a legend title

问题

I am new to Leaflet and I am currently struggling with tutorials. So far I managed to create an interactive clorophet map, like in the example http://leafletjs.com/examples/choropleth.html.

I have a question: is it possible to add a title (simple text, not dynamic) to the legged located on the bottomright of the page? Could anyone tell me how, by just referring to the linked example?

Many thanks, G.

回答1:

You just need to add your title under "THE TITLE"...

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

    var div = L.DomUtil.create('div', 'info legend'),
        grades = [50, 100, 150, 200, 250, 300],
        labels = ['<strong> THE TITLE </strong>'],
        from, to;

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

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


        };

回答2:

Francisco Vargas : getColor is a function that define density :

function getColor(d) {
        return d > 1000 ? '#800026' :
               d > 500  ? '#BD0026' :
               d > 200  ? '#E31A1C' :
               d > 100  ? '#FC4E2A' :
               d > 50   ? '#FD8D3C' :
               d > 20   ? '#FEB24C' :
               d > 10   ? '#FED976' :
                          '#FFEDA0';
}

来源：https://stackoverflow.com/questions/21307647/leaflet-adding-a-legend-title