improve geojson example a bit
This commit is contained in:
parent
9bc31e0f22
commit
35dff37fdb
@ -60,21 +60,21 @@
|
||||
|
||||
|
||||
// control that shows state info on hover
|
||||
var info = L.Util.extend(L.control(), {
|
||||
var info = L.control();
|
||||
|
||||
onAdd: function (map) {
|
||||
info.onAdd = function (map) {
|
||||
this._div = L.DomUtil.create('div', 'info');
|
||||
this.update();
|
||||
return this._div;
|
||||
},
|
||||
};
|
||||
|
||||
update: function (props) {
|
||||
info.update = function (props) {
|
||||
this._div.innerHTML = '<h4>US Population Density</h4>' + (props ?
|
||||
'<b>' + props.name + '</b><br />' + props.density + ' people / mi<sup>2</sup>'
|
||||
: 'Hover over a state');
|
||||
}
|
||||
};
|
||||
|
||||
}).addTo(map);
|
||||
info.addTo(map);
|
||||
|
||||
|
||||
// get color depending on population density value
|
||||
@ -137,25 +137,32 @@
|
||||
onEachFeature: onEachFeature
|
||||
}).addTo(map);
|
||||
|
||||
map.attributionControl.addAttribution('Population data © <a href="http://census.gov/">US Census Bureau</a>');
|
||||
|
||||
// legend control
|
||||
L.Util.extend(L.control({position: 'bottomright'}), {
|
||||
|
||||
onAdd: function (map) {
|
||||
var legend = L.control({position: 'bottomright'});
|
||||
|
||||
legend.onAdd = function (map) {
|
||||
|
||||
var div = L.DomUtil.create('div', 'info legend'),
|
||||
grades = [0, 10, 20, 50, 100, 200, 500, 1000],
|
||||
labels = [];
|
||||
labels = [],
|
||||
from, to;
|
||||
|
||||
for (var i = 0; i < grades.length; i++) {
|
||||
labels.push('<i style="background:' + getColor(grades[i] + 1) + '"></i> ' +
|
||||
grades[i] + (grades[i + 1] ? '–' + grades[i + 1] : '+'));
|
||||
from = grades[i];
|
||||
to = grades[i + 1];
|
||||
|
||||
labels.push(
|
||||
'<i style="background:' + getColor(from + 1) + '"></i> ' +
|
||||
from + (to ? '–' + to : '+'));
|
||||
}
|
||||
|
||||
div.innerHTML = labels.join('<br>');
|
||||
return div;
|
||||
}
|
||||
};
|
||||
|
||||
}).addTo(map);
|
||||
legend.addTo(map);
|
||||
|
||||
</script>
|
||||
</body>
|
||||
|
Loading…
Reference in New Issue
Block a user