fixed zooming in/out functions

data/infobar.js

@@ -164,6 +164,11 @@ mapcanvas.addEventListener("mouseleave",function(event){
     mapcanvas.style.cursor = "default";
 },false);
 
+mapDocument.addEventListener("wheel",function(event){
+    if ( event.target.mozMatchesSelector(".mapcanvas, .mapcanvas *") ){
+        zoomWithinLimit(event, mapcanvas, mapZoomInLimit, mapZoomOutLimit );
+    }
+},false);
 
 
 }

data/style.css

@@ -346,6 +346,7 @@ h3 {
     display: block;
     transform: translate(0px,-2px) rotate(-90deg);
     float: right;
+    z-index: 1000;
 }
 
 .info-panel-controls div{

data/ui.js

@@ -213,19 +213,13 @@ var mapZoomOutLimit    = { w:2711.3, h:1196.7 };
 document.querySelector(".stage").addEventListener("wheel",function(event){
     if ( event.target.mozMatchesSelector(".vizcanvas, .vizcanvas *") && currentVisualization.name != "list" ){
         if ( currentVisualization.name == "graph" ){
-            zoomWithinLimit(event,"vizcanvas", graphZoomInLimit, graphZoomOutLimit);
+            zoomWithinLimit(event, vizcanvas, graphZoomInLimit, graphZoomOutLimit);
         }else{ // clock view
-            zoomWithinLimit(event,"vizcanvas", clockZoomInLimit, clockZoomOutLimit);
+            zoomWithinLimit(event, vizcanvas, clockZoomInLimit, clockZoomOutLimit);
         }
     }
 },false);
 
-document.querySelector(".world-map").addEventListener("wheel",function(event){
-    if ( event.target.mozMatchesSelector(".mapcanvas, .mapcanvas *") ){
-        zoomWithinLimit(event,"mapcanvas", mapZoomInLimit, mapZoomOutLimit );
-    }
-},false);
-
 
 // Check to see if the viewBox of the targeting svg is within the limit we define
 // if yes, zoom
@@ -252,42 +246,30 @@ function zoomWithinLimit(event, targetSvg, zoomInLimit, zoomOutLimit){
 
 // Apply zoom level
 function svgZooming(target,ratio){
-
-    function generateNewViewBox(target, box){
-        var oldWidth = box.w;
-        var newWidth = oldWidth / ratio;
-        var offsetX = ( newWidth - oldWidth ) / 2;
-
-        var oldHeight = box.h;
-        var newHeight = oldHeight / ratio;
-        var offsetY = ( newHeight - oldHeight ) / 2;
-
-        box.w = box.w / ratio;
-        box.h = box.h / ratio;
-        box.x = box.x - offsetX;
-
-        if ( target == "vizcanvas" ){
-            box.y = ( currentVisualization.name == "graph") ? (box.y - offsetY) : -1 * (box.h - 5);
-        }else{
-            box.y = box.y - offsetY;
-        }
-
-        return box;
-    }
-
-    if ( target == "vizcanvas" ){
-        var box = getZoom(vizcanvas);
-        var newViewBox = generateNewViewBox(target, box);
-        setZoom(newViewBox,vizcanvas);
-
-    }else{
-        var box = getZoom(mapcanvas);
-        var newViewBox = generateNewViewBox(target, box);
-        setZoom(newViewBox, mapcanvas);
-    }
-
+    var box = getZoom(target);
+    var newViewBox = generateNewViewBox(target,box,ratio);
+    setZoom(newViewBox, target);
 }
 
+function generateNewViewBox(target,box,ratio){
+    var oldWidth = box.w;
+    var newWidth = oldWidth / ratio;
+    var offsetX = ( newWidth - oldWidth ) / 2;
+
+    var oldHeight = box.h;
+    var newHeight = oldHeight / ratio;
+    var offsetY = ( newHeight - oldHeight ) / 2;
+
+    box.w = box.w / ratio;
+    box.h = box.h / ratio;
+    box.x = box.x - offsetX;
+    box.y = box.y - offsetY;
+
+    return box;
+}
+
+
+
 
 /* Pan by dragging ======================================== */