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);