RuntimeError: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The source width is 0.

Hello folks,
I am encountering a critical problem with large PNGs. My notebook is working fine when using 3k x 4k images but when loading large images of size 30k x 19 k, I am getting the below error:
RuntimeError: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The source width is 0.

Have any of you faced similar issues? Sorry due to some restrictions, I cannot share the code and image. My notebook fails at the image reading stage.

1 Like

The size of a canvas is limited by various factors that differ from browser to browser, the most important one being memory. Just instantiating an ImageData object of that size will require more than 2GB (4 channels per pixel, each 1 byte).

Edit: At least in my tests in Chrome the limits appear to be:

  • no side can be longer than 65535 pixels
  • The total size is limited to 2^28 px (1 GB memory)