fabric.js，在context上创建一些形状

Question

这是关于fabric.js的问题。我一直在尝试在contextTop上创建一些形状。当您在contextTop上创建一些形状（不使用add）时，如何将它们与fabric.js画布合并？

let canvas = new fabric.Canvas('C');
canvas.contextTop.StrokeRect(12,12,30,30);

然后，我要使Rect出现在画布上。我该怎么办？有人可以告诉我如何在fabric.js中使用canvas API吗？

我不了解contextTop，contextContainer ...

Answer 1

您不能直接使用canvas API。
FabricJS是一个可以在画布上工作的框架，您必须使用框架规则，否则它将中断。

ContextTop是upperCanvas中getContext（'2d'）的结果，其中up​​perCanvas是一个位于主画布之上的画布，可以进行一些不需要完全刷新画布的快速绘制。

在提供的API之外完成的所有html5画布绘制都将在下一帧擦除。

要绘制一个rect，您必须创建rect类并将其添加到画布中，这是正确的方法：

var rect = new fabric.Rect({ width: 200, height: 300 });
canvas.add(rect);