cartodb/Leaflet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

improve geojson example a bit

Browse Source
This commit is contained in:
Vladimir Agafonkin 2012-08-07 11:56:48 +03:00
parent 9bc31e0f22
commit 35dff37fdb
1 changed files with 32 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
debug/vector/geojson.html
View File

@ -60,21 +60,21 @@
// control that shows state info on hover // 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._div = L.DomUtil.create('div', 'info');
this.update(); this.update();
return this._div; return this._div;
}, };
update: function (props) { info.update = function (props) {
this._div.innerHTML = '<h4>US Population Density</h4>' + (props ? this._div.innerHTML = '<h4>US Population Density</h4>' + (props ?
'<b>' + props.name + '</b><br />' + props.density + ' people / mi<sup>2</sup>' '<b>' + props.name + '</b><br />' + props.density + ' people / mi<sup>2</sup>'
: 'Hover over a state'); : 'Hover over a state');
} };
}).addTo(map); info.addTo(map);
// get color depending on population density value // get color depending on population density value
@ -137,25 +137,32 @@
onEachFeature: onEachFeature onEachFeature: onEachFeature
}).addTo(map); }).addTo(map);
map.attributionControl.addAttribution('Population data &copy; <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'), var div = L.DomUtil.create('div', 'info legend'),
grades = [0, 10, 20, 50, 100, 200, 500, 1000], grades = [0, 10, 20, 50, 100, 200, 500, 1000],
labels = []; labels = [],
from, to;
for (var i = 0; i < grades.length; i++) { for (var i = 0; i < grades.length; i++) {
labels.push('<i style="background:' + getColor(grades[i] + 1) + '"></i> ' + from = grades[i];
grades[i] + (grades[i + 1] ? '&ndash;' + grades[i + 1] : '+')); to = grades[i + 1];
labels.push(
'<i style="background:' + getColor(from + 1) + '"></i> ' +
from + (to ? '&ndash;' + to : '+'));
} }
div.innerHTML = labels.join('<br>'); div.innerHTML = labels.join('<br>');
return div; return div;
} };
}).addTo(map); legend.addTo(map);
</script> </script>
</body> </body>