object disappears after canvas.setWidth/setHeight with some magic numbers

[Yaojian]

Test Case

https://jsfiddle.net/Yaojian/2wrfba13/

Problem

The rect disappears after canvas.setWidth/setHeight greater than some magic number, for example, set width greater than 10001 or set height greater than 6710.

Is there a limitation of the size of canvas ?

Version

fabricjs version: 1.7.9

Enviornment (updated on 04/08/2017)

Browser: chrome 57.0.2987.133 (64-bit) or Safari 9.1.3 (11601.7.8)
OS: OS X 10.11.6 on retina MacBook Pro

For FireFox, the limitations is 1251 * 6701, which is much smaller :-(

[ncou]

Hi,

I can't reproduce this bug, which navigator are you using ?

[asturur]

Yes there is a size limit.
First of all if you are on macbook with retina you are working on a double size of what you size.

What browser where you using? for me it works.

[Yaojian]

Browser: chrome 57.0.2987.133 (64-bit) or Safari 9.1.3 (11601.7.8)
OS: OS X 10.11.6 on retina MacBook Pro

For FireFox, the limitation is 1251 * 6701, which is much smaller :-(

[Yaojian]

@asturur @ncou could you reproduce the bug? Be aware to increase the value of witdh/height before running the test.

[asturur]

Sure. Canvas has its own limits.
Currents limits make canvas element crash without notice for the user.

Max supported dimensions on chrome and firefox are around more or less 20.000 per size.

Having 10.000 on a retina screen equals to 20.000

You cannot go much bigger in a browser.

[Yaojian]

@asturur thanks for your reply.

What does 20.000 mean ? In chrome, I can get a canvas with 10001 * 6710, which is 67106710.

[asturur]

20.000 x side is the limit more or less. 10000 with retina scaling is doubled.

please try to set enableRetinaScaling to false and it should work up to 20.000