Add a function for getting zoom range (#780)

* Add a function for getting current zoom range

* Change API to be more in line with existing

Update types for getInitialScaleBounds - its implementation shows that it may return undefined.

* Update docs

---------

Co-authored-by: Jukka Kurkela <[email protected]>

Author: joshkel

docs/guide/developers.md

@@ -26,7 +26,7 @@ Returns the current zoom level.  If this is the same as the chart's initial scal
 
 If the chart has been panned but not zoomed, this method will still return `1.0`.
 
-### `chart.getInitialScaleBounds(): Record<string, {min: number, max: number}>`
+### `chart.getInitialScaleBounds(): Record<string, {min: number | undefined, max: number | undefined}>`
 
 Returns the initial scale bounds of each scale before any zooming or panning took place.  This is returned in the format of an object, e.g.
 
@@ -38,6 +38,20 @@ Returns the initial scale bounds of each scale before any zooming or panning too
 }
 ```
 
+### `chart.getZoomedScaleBounds(): Record<string, {min: number, max: number}>`
+
+Returns the updated scale bounds of each scale after any zooming or panning took place.  This is returned in the format of an object, e.g.
+
+```json
+{
+  x: {min: 25, max: 75},
+  y1: {min: 60, max: 90},
+  y2: undefined
+}
+```
+
+Scale IDs that have not been zoomed will be `undefined` within the returned object.
+
 ### `chart.isZoomedOrPanned(): boolean`
 
 Returns whether the chart has been zoomed or panned - i.e. whether the initial scale of any axis is different to the one used currently.

src/core.js

@@ -127,6 +127,7 @@ export function resetZoom(chart, transition = 'default') {
       delete scaleOptions.min;
       delete scaleOptions.max;
     }
+    delete state.updatedScaleLimits[scale.id];
   });
   chart.update(transition);
   call(state.options.zoom.onZoomComplete, [{chart}]);
@@ -209,6 +210,16 @@ export function getInitialScaleBounds(chart) {
   return scaleBounds;
 }
 
+export function getZoomedScaleBounds(chart) {
+  const state = getState(chart);
+  const scaleBounds = {};
+  for (const scaleId of Object.keys(chart.scales)) {
+    scaleBounds[scaleId] = state.updatedScaleLimits[scaleId];
+  }
+
+  return scaleBounds;
+}
+
 export function isZoomedOrPanned(chart) {
   const scaleBounds = getInitialScaleBounds(chart);
   for (const scaleId of Object.keys(chart.scales)) {

src/plugin.js

@@ -1,7 +1,7 @@
 import Hammer from 'hammerjs';
 import {addListeners, computeDragRect, removeListeners} from './handlers';
 import {startHammer, stopHammer} from './hammer';
-import {pan, zoom, resetZoom, zoomScale, getZoomLevel, getInitialScaleBounds, isZoomedOrPanned, isZoomingOrPanning, zoomRect} from './core';
+import {pan, zoom, resetZoom, zoomScale, getZoomLevel, getInitialScaleBounds, getZoomedScaleBounds, isZoomedOrPanned, isZoomingOrPanning, zoomRect} from './core';
 import {panFunctions, zoomFunctions, zoomRectFunctions} from './scale.types';
 import {getState, removeState} from './state';
 import {version} from '../package.json';
@@ -82,6 +82,7 @@ export default {
     chart.resetZoom = (transition) => resetZoom(chart, transition);
     chart.getZoomLevel = () => getZoomLevel(chart);
     chart.getInitialScaleBounds = () => getInitialScaleBounds(chart);
+    chart.getZoomedScaleBounds = () => getZoomedScaleBounds(chart);
     chart.isZoomedOrPanned = () => isZoomedOrPanned(chart);
     chart.isZoomingOrPanning = () => isZoomingOrPanning(chart);
   },

test/specs/api.spec.js

@@ -342,4 +342,31 @@ describe('api', function() {
       expect(chart.isZoomedOrPanned()).toBe(false);
     });
   });
+
+  describe('getZoomedScaleBounds', function() {
+    it('should return the zoom range, or undefined if not zoomed', function() {
+      const chart = window.acquireChart({
+        type: 'scatter',
+        options: {
+          scales: {
+            x: {
+              min: 0,
+              max: 100
+            },
+            y: {
+              min: 0,
+              max: 100
+            }
+          }
+        }
+      });
+      expect(chart.getZoomedScaleBounds().x).toBeUndefined();
+
+      chart.zoom(1.5);
+      expect(chart.getZoomedScaleBounds().x).toEqual({min: 25, max: 75});
+
+      chart.resetZoom();
+      expect(chart.getZoomedScaleBounds().x).toBeUndefined();
+    });
+  });
 });

types/index.d.ts

@@ -25,7 +25,8 @@ declare module 'chart.js' {
     zoomScale(id: string, range: ScaleRange, mode?: UpdateMode): void;
     resetZoom(mode?: UpdateMode): void;
     getZoomLevel(): number;
-    getInitialScaleBounds(): Record<string, {min: number, max: number}>;
+    getInitialScaleBounds(): Record<string, {min: number | undefined, max: number | undefined}>;
+    getZoomedScaleBounds(): Record<string, ScaleRange | undefined>;
     isZoomedOrPanned(): boolean;
     isZoomingOrPanning(): boolean;
   }
@@ -55,6 +56,7 @@ export function zoomRect(chart: Chart, p0: Point, p1: Point, mode?: UpdateMode):
 export function zoomScale(chart: Chart, scaleId: string, range: ScaleRange, mode?: UpdateMode): void;
 export function resetZoom(chart: Chart, mode?: UpdateMode): void;
 export function getZoomLevel(chart: Chart): number;
-export function getInitialScaleBounds(chart: Chart): Record<string, {min: number, max: number}>;
+export function getInitialScaleBounds(chart: Chart): Record<string, {min: number | undefined, max: number | undefined}>;
+export function getZoomedScaleBounds(chart: Chart): Record<string, ScaleRange | undefined>;
 export function isZoomedOrPanned(chart: Chart): boolean;
 export function isZoomingOrPanning(chart: Chart): boolean;