All working good (scales)

ChartsSpace/CoordinateSystem.js

@@ -95,12 +95,12 @@ function newCoordinateSystem () {
     }
   }
 
-  function recalculateScale () {
+  function recalculateScale (event) {
     /* Defines the initial Zoom level at center position. */
     thisObject.scale.x = thisObject.maxWidth / (thisObject.max.x - thisObject.min.x)
     thisObject.scale.y = thisObject.maxHeight / (thisObject.max.y - thisObject.min.y)
 
-    thisObject.eventHandler.raiseEvent('Scale Changed')
+    thisObject.eventHandler.raiseEvent('Scale Changed', event)
   }
 
   function initializeX (minValue, maxValue, maxWidth) {

ChartsSpace/EdgeEditor.js

@@ -187,7 +187,11 @@ function newEdgeEditor () {
           case 'left mouse button': {
             coordinateSystem.max.y = newMaxRate
             coordinateSystem.maxHeight = thisObject.container.parentContainer.frame.height
-            coordinateSystem.recalculateScale()
+            let event = {
+              border: 'top',
+              dragVector: dragVector
+            }
+            coordinateSystem.recalculateScale(event)
             break
           }
           case 'right mouse button': {
@@ -216,7 +220,11 @@ function newEdgeEditor () {
           case 'left mouse button': {
             coordinateSystem.min.y = newMinRate
             coordinateSystem.maxHeight = thisObject.container.parentContainer.frame.height
-            coordinateSystem.recalculateScale()
+            let event = {
+              border: 'bottom',
+              dragVector: dragVector
+            }
+            coordinateSystem.recalculateScale(event)
             break
           }
           case 'right mouse button': {

ChartsSpace/TimelineChart.js

@@ -231,7 +231,10 @@ function newTimelineChart () {
     }
   }
 
-  function onScaleChanged () {
+  function onScaleChanged (event) {
+    if (thisObject.rateScale !== undefined) {
+      thisObject.rateScale.onBorderChanged(event)
+    }
     timelineChartCoordinateSystem.min.x = timeMachineCoordinateSystem.min.x
     timelineChartCoordinateSystem.max.x = timeMachineCoordinateSystem.max.x
     timelineChartCoordinateSystem.maxHeight = timeMachineCoordinateSystem.maxHeight

Scales/RateScale.js

@@ -10,6 +10,7 @@ function newRateScale () {
     maxValue: undefined,
     isVisible: true,
     layersOn: undefined,
+    onBorderChanged: onBorderChanged,
     onMouseOverSomeTimeMachineContainer: onMouseOverSomeTimeMachineContainer,
     physics: physics,
     draw: draw,
@@ -216,6 +217,32 @@ function newRateScale () {
     coordinateSystem.recalculateScale()
   }
 
+  function onBorderChanged (event) {
+    if (event === undefined) { return }
+    if (event.border === 'top') {
+      let point = {
+        x: event.dragVector.x,
+        y: event.dragVector.y
+      }
+      let newMaxRate = getRateFromPointAtContainer(point, rateCalculationsContainer, coordinateSystem)
+
+      coordinateSystem.max.y = newMaxRate
+      coordinateSystem.maxHeight = rateCalculationsContainer.frame.height
+      coordinateSystem.recalculateScale()
+    }
+    if (event.border === 'bottom') {
+      let point = {
+        x: event.dragVector.x,
+        y: event.dragVector.y + rateCalculationsContainer.frame.height
+      }
+      let newMinRate = getRateFromPointAtContainer(point, rateCalculationsContainer, coordinateSystem)
+
+      coordinateSystem.min.y = newMinRate
+      coordinateSystem.maxHeight = rateCalculationsContainer.frame.height
+      coordinateSystem.recalculateScale()
+    }
+  }
+
   function positioningPhysics () {
     /* Container Limits */