Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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.

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?

like image 457
Gion Mors Avatar asked Jan 23 '14 12:01

Gion Mors


1 Answers

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;


        };
like image 159
Gion Mors Avatar answered Sep 25 '22 19:09

Gion Mors