Plotly.js: Fast scroll zoom results in out of memory error

[arnog]

See https://codepen.io/arnog/pen/YgZdEZ

1. Create a heatmap plot with about 500 x 500 elements
2. Configure the plot with scrollZoom = true and zsmooth = 'fast'
3. Use the mouse wheel to zoom in rapidly into the plot

Result:

• the plot is not zoomed in and the console displays "Uncaught RangeError: Invalid array length"

The array being created is the pixel array in which to draw the interpolated heatmap at traces/heatmap/plot.js:238

The problem seems to be that imageWidth and imageHeight are used here and later in the function, perhaps instead of canvasW and canvasH.

[antoinerg]

@arnog I could not replicate the particular error message you received. What operating system and web browser were you using?

@archmoj Can you reproduce this issue?

[antoinerg]

While investigating the issue reported by @arnog, I uncovered the following bug in heatmapgl: https://github.com/plotly/plotly.js/issues/3624

[alexcjohnson]

I managed to crash the browser tab zooming in on this plot. It got slower and slower as I zoomed in, eventually crashing. But I also see a bug when you zoom out, an increasingly small fraction of the total trace is shown.

Mac OS 10.14, Chrome 72.

[antoinerg]

I could reproduce the issue as well. When zooming in, the memory usage skyrockets from ~200M to a whopping 1500M.

NixOS 18.09, Chromium 69

Thanks @arnog