From 35dff37fdbc9c9145c945466c8529e23298b5a45 Mon Sep 17 00:00:00 2001
From: Vladimir Agafonkin <agafonkin@gmail.com>
Date: Tue, 7 Aug 2012 11:56:48 +0300
Subject: [PATCH] improve geojson example a bit

---
 debug/vector/geojson.html | 57 ++++++++++++++++++++++-----------------
 1 file changed, 32 insertions(+), 25 deletions(-)

diff --git a/debug/vector/geojson.html b/debug/vector/geojson.html
index fa426137..d5d4a104 100644
--- a/debug/vector/geojson.html
+++ b/debug/vector/geojson.html
@@ -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) {
-				this._div = L.DomUtil.create('div', 'info');
-				this.update();
-				return this._div;
-			},
+		info.onAdd = function (map) {
+			this._div = L.DomUtil.create('div', 'info');
+			this.update();
+			return this._div;
+		};
 
-			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');
-			}
+		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 &copy; <a href="http://census.gov/">US Census Bureau</a>');
 
-		// legend control
-		L.Util.extend(L.control({position: 'bottomright'}), {
 
-			onAdd: function (map) {
-				var div = L.DomUtil.create('div', 'info legend'),
-					grades = [0, 10, 20, 50, 100, 200, 500, 1000],
-					labels = [];
+		var legend = L.control({position: 'bottomright'});
 
-				for (var i = 0; i < grades.length; i++) {
-					labels.push('<i style="background:' + getColor(grades[i] + 1) + '"></i> ' +
-						grades[i] + (grades[i + 1] ? '&ndash;' + grades[i + 1] : '+'));
-				}
+		legend.onAdd = function (map) {
 
-				div.innerHTML = labels.join('<br>');
-				return div;
+			var div = L.DomUtil.create('div', 'info legend'),
+				grades = [0, 10, 20, 50, 100, 200, 500, 1000],
+				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 : '+'));
 			}
 
-		}).addTo(map);
+			div.innerHTML = labels.join('<br>');
+			return div;
+		};
+
+		legend.addTo(map);
 
 	</script>
 </body>