From 788ed3a884343ce8ac0716d1f02c3a806b0abaac Mon Sep 17 00:00:00 2001
From: Christopher Baines <cbaines8@gmail.com>
Date: Sun, 2 Dec 2012 12:53:52 +0000
Subject: Add basic key

---
 resources/map.css | 24 ++++++++++++++++++++++++
 resources/map.js  | 10 ++++++++++
 2 files changed, 34 insertions(+)

diff --git a/resources/map.css b/resources/map.css
index 8035091..918cf4d 100644
--- a/resources/map.css
+++ b/resources/map.css
@@ -6,3 +6,27 @@ body {
 html, body, #map {
   height: 100%;
 }
+
+.info {
+    padding: 6px 8px;
+    font: 14px/16px Arial, Helvetica, sans-serif;
+    background: white;
+    background: rgba(255,255,255,0.8);
+    box-shadow: 0 0 15px rgba(0,0,0,0.2);
+    border-radius: 5px;
+}
+.info h4 {
+    margin: 0 0 5px;
+    color: #777;
+}
+.legend {
+    line-height: 18px;
+    color: #555;
+}
+.legend i {
+    width: 18px;
+    height: 18px;
+    float: left;
+    margin-right: 8px;
+    opacity: 0.7;
+}
diff --git a/resources/map.js b/resources/map.js
index 50fdd87..95ef6b5 100644
--- a/resources/map.js
+++ b/resources/map.js
@@ -61,6 +61,16 @@ $(document).ready(function() {
 
 	map.locate({setView: true, maxZoom: 12});
 
+    var legend = L.control({position: 'bottomright'});
+    legend.onAdd = function (map) {
+        var div = L.DomUtil.create('div', 'info legend');
+
+        div.innerHTML += '<img href="resources/img/hospital.png"> Hospital<br>';
+
+        return div;
+    };
+    legend.addTo(map);
+
 	function buildLayer(data) {
 		return L.geoJson(data, {
 				onEachFeature: function(feature, layer) {
-- 
cgit v1.2.3