added mouseover value to screen

timmysiauw · Dec 13, 2016 · 772c214 · 772c214
1 parent 8ede911
commit 772c214
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 5 deletions.
diff --git a/modemap.css b/modemap.css
@@ -12,14 +12,24 @@
 }
 
 .wkhr-slider {
-    width: 550px;
+    width: 500px;
     display: inline-block;
     vertical-align: middle;
     line-height: 30px;
 }
 
 .wkhr-display {
-    width: 250px;
+    width: 200px;
+    display: inline-block;
+    vertical-align: middle;
+    line-height: 30px;
+    font-size: 12px;
+    font-weight: bold;
+    text-align: center;
+}
+
+.val-display {
+    width: 100px;
     display: inline-block;
     vertical-align: middle;
     line-height: 30px;

diff --git a/modemap.js b/modemap.js
@@ -261,7 +261,7 @@ var modemap = function() {
 
             var map = mapping.init(map_id, center, default_zoom)
 
-            $("#" + map_id).after("<div class='wkhr-slider-container'><input id='" + map_id + "-wkhr-slider' class='wkhr-slider' type='range' min='0' max='167' step='0' value='0'><div id='" + map_id + "-wkhr-display' class='wkhr-display'>0</div></div>")
+            $("#" + map_id).after("<div class='wkhr-slider-container'><input id='" + map_id + "-wkhr-slider' class='wkhr-slider' type='range' min='0' max='167' step='0' value='0'><div id='" + map_id + "-wkhr-display' class='wkhr-display'>0</div><div id='" + map_id + "-val-display' class='val-display'</div>")
 
             var layers = []
 
@@ -288,8 +288,11 @@ var modemap = function() {
                         layer.gh_val = content[i][val_col]
 
                         layer.on("mouseover", function(e) {
-                            console.log("this happened")
-                            console.log(this.gh_val)
+                            //console.log("this happened")
+                            //console.log(this.gh_val)
+
+                            $("#" + map_id + "-val-display").text(this.gh_val)
+
                         })
 
                         layer.addTo(map)
@@ -328,6 +331,7 @@ var modemap = function() {
 
              }).trigger("change")
 
+
         }
 
     }