如何在 html5 canvas 中绘制 Fabric js strokeRect？

Question

我正在使用 html5 canvas 库 Fabric js 绘制形状：

代码： canvas.add(new fabric.Rect({top: 100, left: 100, width: 50, height: 50, fill: 'empty', stroke: 'white', strokeWidth: 1}));

但是它在我不想要的中间区域填充黑色。 我想要 html5 canvas 中的 strokeRect 之类的功能。 有什么建议吗？

Answer 1

使用 transparent 而不是 empty 来 fill 矩形。

样本：

canvas.add(new fabric.Rect({top: 100,
    left: 100,
    width: 50,
    height: 50,
    fill: 'transparent',
    stroke: 'white',
    strokeWidth: 1
}));

Answer 2

canvas.add(new fabric.Rect({ top : 100, left : 100, width : 50, height : 50, fill : '', stroke : 'white', strokeWidth : 1 }));