both scales working with the coordinate system

ChartsSpace/CoordinateSystem.js

@@ -15,6 +15,8 @@ function newCoordinateSystem () {
     maxWidth: undefined,
     scale: undefined,
     eventHandler: undefined,
+    zoomX: zoomX,
+    zoomY: zoomY,
     recalculateScale: recalculateScale,
     transformThisPoint: transformThisPoint,
     transformThisPoint2: transformThisPoint2,
@@ -63,6 +65,36 @@ function newCoordinateSystem () {
     recalculateScale()
   }
 
+  function zoomX (factor, mousePosition, container) {
+    let mouseAtCointainer = unTransformThisPoint(mousePosition, container)
+    let leftDistance = mouseAtCointainer.x
+    let rightDistance = container.frame.width - mouseAtCointainer.x
+    let diff = thisObject.max.x - thisObject.min.x
+    let min = thisObject.min.x + diff * factor * leftDistance / (container.frame.width / 2)
+    let max = thisObject.max.x - diff * factor * rightDistance / (container.frame.width / 2)
+
+    if (min < max) {
+      thisObject.min.x = min
+      thisObject.max.x = max
+      thisObject.recalculateScale()
+    }
+  }
+
+  function zoomY (factor, mousePosition, container) {
+    let mouseAtCointainer = unTransformThisPoint(mousePosition, container)
+    let topDistance = mouseAtCointainer.y
+    let bottomDistance = container.frame.height - mouseAtCointainer.y
+    let diff = thisObject.max.y - thisObject.min.y
+    let min = thisObject.min.y + diff * factor * bottomDistance / (container.frame.height / 2)
+    let max = thisObject.max.y - diff * factor * topDistance / (container.frame.height / 2)
+
+    if (min < max) {
+      thisObject.min.y = min
+      thisObject.max.y = max
+      thisObject.recalculateScale()
+    }
+  }
+
   function recalculateScale () {
     /* Defines the initial Zoom level at center position. */
     thisObject.scale.x = thisObject.maxWidth / (thisObject.max.x - thisObject.min.x)

Scales/RateScale.js

@@ -138,12 +138,10 @@ function newRateScale () {
   }
 
   function onMouseWheel (event) {
-    let morePower = 1
-    let delta
-
     if (event.shiftKey === true) {
+      let morePower = 1
       if (event.buttons === 4) { morePower = 10 } // Mouse wheel pressed.
-      delta = event.wheelDelta
+      let delta = event.wheelDelta
       if (delta < 0) {
         thisObject.offset = thisObject.offset - STEP_OFFSET * morePower
         if (thisObject.offset < MIN_OFFSET) { thisObject.offset = STEP_OFFSET }
@@ -168,6 +166,20 @@ function newRateScale () {
       offsetTimer = 100
       scaleTimer = 0
     } else {
+      let factor
+      let morePower = 1
+      if (event.buttons === 4) { morePower = 10 } // Mouse wheel pressed.
+
+      let delta = event.wheelDelta
+      if (delta < 0) {
+        factor = -0.01 * morePower
+      } else {
+        factor = 0.01 * morePower
+      }
+
+      coordinateSystem.zoomY(factor, event, limitingContainer)
+
+      return
       if (event.buttons === 4) { morePower = 5 } // Mouse wheel pressed.
       delta = event.wheelDelta
       if (delta < 0) {

Scales/TimeScale.js

@@ -121,18 +121,20 @@ function newTimeScale () {
   }
 
   function onMouseWheel (event) {
+    let factor
     let morePower = 1
-    if (event.buttons === 4) { morePower = 5 } // Mouse wheel pressed.
+    if (event.buttons === 4) { morePower = 10 } // Mouse wheel pressed.
 
-    delta = event.wheelDelta
+    let delta = event.wheelDelta
     if (delta < 0) {
-      thisObject.scale = thisObject.scale - STEP_SCALE * morePower
-      if (thisObject.scale < MIN_SCALE) { thisObject.scale = MIN_SCALE }
+      factor = -0.01 * morePower
     } else {
-      thisObject.scale = thisObject.scale + STEP_SCALE * morePower
-      if (thisObject.scale > MAX_SCALE) { thisObject.scale = MAX_SCALE }
+      factor = 0.01 * morePower
     }
 
+    coordinateSystem.zoomX(factor, event, limitingContainer)
+
+    return
     if (
       thisObject.scale <= DEFAULT_SCALE + SNAP_THRESHOLD_SCALE &&
       thisObject.scale >= DEFAULT_SCALE - SNAP_THRESHOLD_SCALE