gridviz 2.0.32 → 2.0.34

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "gridviz",
-    "version": "2.0.32",
+    "version": "2.0.34",
     "description": "Visualization tool for gridded statistics",
     "keywords": [
         "statistics",
@@ -39,7 +39,7 @@
         "start-dev": "webpack --config webpack.config.dev.cjs",
         "server": "webpack serve -c webpack.config.dev.js --static ./",
         "doc": "./node_modules/.bin/jsdoc src/ src/dataset src/legend src/style -d docs/jsdoc",
-        "build": "webpack --config webpack.config.prod.cjs",
+        "build-prod": "webpack --config webpack.config.prod.cjs",
         "test": "jest"
     },
     "files": [

package/src/App.js

@@ -283,7 +283,10 @@ export class App {
         container.addEventListener('mouseout', () => {
             this.tooltip.hide()
         })
-        this.cg.onZoomStartFun = () => {
+
+        // add extra logic to onZoomStartFun
+        this.cg.onZoomStartFun = (e) => {
+            if (opts.onZoomStartFun) opts.onZoomStartFun(e)
             this.tooltip.hide()
         }
 
@@ -663,16 +666,26 @@ export class App {
      */
     defineResizeObserver(container, canvas) {
         // listen to resize events
-        const resizeObserver = new ResizeObserver(() => {
-            // update the app and canvas size
-            if (this.h !== container.clientHeight || this.w !== container.clientWidth) {
-                this.h = container.clientHeight
-                this.w = container.clientWidth
-                this.cg.h = container.clientHeight
-                this.cg.w = container.clientWidth
-                canvas.setAttribute('width', '' + this.w)
-                canvas.setAttribute('height', '' + this.h)
-                this.redraw()
+        const resizeObserver = new ResizeObserver((entries) => {
+            // make sure canvas has been built
+            if (container.clientWidth > 0 && container.clientHeight > 0) {
+                // make sure we dont exceed loop limit first
+                // see: https://stackoverflow.com/questions/49384120/resizeobserver-loop-limit-exceeded
+                window.requestAnimationFrame(() => {
+                    if (!Array.isArray(entries) || !entries.length) {
+                        return
+                    }
+                    // update the app and canvas size
+                    if (this.h !== container.clientHeight || this.w !== container.clientWidth) {
+                        this.h = container.clientHeight
+                        this.w = container.clientWidth
+                        this.cg.h = container.clientHeight
+                        this.cg.w = container.clientWidth
+                        canvas.setAttribute('width', '' + this.w)
+                        canvas.setAttribute('height', '' + this.h)
+                        this.redraw()
+                    }
+                })
             }
         })