滤镜未拉伸至 canvas - fabric.js 全宽的背景图片
Background image with filters not stretching to full width of canvas - fabric.js
我正在使用 fabric.js。
我正在将背景图片加载到 canvas 中，但图片没有拉伸。
如果我只上传图像一切都很好，当我向背景图像添加过滤器时，背景图像不会拉伸到 canvas.
的全宽
我尝试在加载图片后添加滤镜。
也尝试删除背景并再次加载，一切都去同一个地方......图像不拉伸。
这是一个只有背景图片的 fiddle：
`https://jsfiddle.net/Music/6mcf4kj0/2/`
这是 fiddle 背景图片和滤镜：
`https://jsfiddle.net/Music/q30cfwL7/1/`
我希望图像是 canvas 的全宽和全高。
您的图片尺寸为 3000x3000，对于默认的 fabric.js 设置来说太大了。来自 filter docs:
The picture will be painted over a tile of 2048x2048 size, bigger
pictures won't fit. fabric.textureSize set at 2408 is a safe limit.
Most of the hardware will support 4096 and so 4096x4096 is a limit
that will probably work and give you less headaches. Take in mind that
canvas has a max size too. If you are supporting browsers like IE11
you will have probably problems with canvases bigger than 5000 on a
size, whatever your webgl hardware is capable of.
在应用过滤器之前尝试这个：
fabric.textureSize = 4096
您也可以查看是否支持Webgl然后申请
if (fabric.isWebglSupported()) fabric.textureSize = 65536;
我正在使用 fabric.js。 我正在将背景图片加载到 canvas 中，但图片没有拉伸。 如果我只上传图像一切都很好，当我向背景图像添加过滤器时，背景图像不会拉伸到 canvas.
的全宽我尝试在加载图片后添加滤镜。 也尝试删除背景并再次加载，一切都去同一个地方......图像不拉伸。
这是一个只有背景图片的 fiddle：
`https://jsfiddle.net/Music/6mcf4kj0/2/`
这是 fiddle 背景图片和滤镜：
`https://jsfiddle.net/Music/q30cfwL7/1/`
我希望图像是 canvas 的全宽和全高。
您的图片尺寸为 3000x3000，对于默认的 fabric.js 设置来说太大了。来自 filter docs:
The picture will be painted over a tile of 2048x2048 size, bigger pictures won't fit. fabric.textureSize set at 2408 is a safe limit. Most of the hardware will support 4096 and so 4096x4096 is a limit that will probably work and give you less headaches. Take in mind that canvas has a max size too. If you are supporting browsers like IE11 you will have probably problems with canvases bigger than 5000 on a size, whatever your webgl hardware is capable of.
在应用过滤器之前尝试这个：
fabric.textureSize = 4096
您也可以查看是否支持Webgl然后申请
if (fabric.isWebglSupported()) fabric.textureSize = 65536;