fabricjs删除backgroundImage [英] fabricjs delete backgroundImage

问题描述

是否可以在设置 fabric.Canvas 后删除backgroundImage： canvas.setBackgroundImage（'img_url'，function（）{
canvas.renderAll（）;


或者回到标准背景？将 backgroundColor 设置为 white isn'

感谢您的帮助！
Greetings Max

解决方案

这是来自 renderAll fabric.Canvas ;

$的功能b $ b pre $ ...
if（this.backgroundColor）{
canvasToDrawOn.fillStyle = this.backgroundColor;
canvasToDrawOn.fillRect（0 ，0，this.width，this.height）;
}

if（typeof this.backgroundImage ==='object'）{
this._drawBackroundImage（canvasToDrawOn）;
}
...


显然，背景颜色实际上，当你做时被设置为白色canvas.backgroundColor = white; 。但是，由于 canvas.backgroundImage 仍然是 Image 对象，所以它会绘制在您填充背景的任何颜色上。

所以，当你不想绘制 backgroundImage 时，你需要将它设置为 0 。它不适用于 null ，因为 typeof this.backgroundImage ==='object'仍然评估为<$在 renderAll 中提示c $ c> true ，提示 backgroundImage 被绘制。它适用于 canvas.backgroundImage = 0; ，但是。 示例 。

Is it possible to delete the backgroundImage in a fabric.Canvas after setting with:

canvas.setBackgroundImage('img_url',function() { 
    canvas.renderAll();

Or just go back to the standard background? To set the backgroundColor to white isn't working.

Thanks for helping! Greetings Max

解决方案

This is a snippet from renderAll function of fabric.Canvas;

...
if (this.backgroundColor) {
    canvasToDrawOn.fillStyle = this.backgroundColor;
    canvasToDrawOn.fillRect(0, 0, this.width, this.height);
}

if (typeof this.backgroundImage === 'object') {
    this._drawBackroundImage(canvasToDrawOn);
}
...

Clearly, the background color is, in fact, being set to white when you do canvas.backgroundColor = white;. But, since canvas.backgroundImage is still an Image object, it is drawn over whatever color you fill the background with.

So, when you don't want the backgroundImage to be drawn, you need to set it to 0. It doesn't work with null, since typeof this.backgroundImage === 'object' still evaluates to true in renderAll, prompting backgroundImage to be drawn. It works with canvas.backgroundImage = 0;, though.

Example.

这篇关于fabricjs删除backgroundImage的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！