我正在尝试为组设置背景色,而不影响其包含的对象。
到目前为止,我的代码如下所示:
var canvas = new fabric.Canvas('canvas');
var helloText = new fabric.Text('hello', {
fontSize: 30,
top: 10, left: 10,
originX: 0, originY: 0
});
var worldText = new fabric.Text('world!', {
fontSize: 40,
top: 50, left: 100,
originX: 0, originY: 0
});
var group = new fabric.Group([helloText, worldText], {
selectionBackgroundColor: 'red',
backgroundColor: 'blue'
});
canvas.add(group);
可以在here中找到jsFiddle版本。
从代码中可以看到,我已经尝试了
backgroundColor
属性,但它只影响包含的对象。我想达到类似于selectionBackgroundColor
的效果。 最佳答案
稍作调整,但这应该为您做到(相关代码):
var text = new fabric.Group([helloText, worldText], {});
var textBoundingRect = text.getBoundingRect();
var background = new fabric.Rect({
top: textBoundingRect.top,
left: textBoundingRect.left,
width: textBoundingRect.width,
height: textBoundingRect.height,
fill: 'blue'
});
var group = new fabric.Group([background, text], {});
您的JSFiddle已更新,https://jsfiddle.net/rekrah/92ss3d86/。