我如何动态地改变在Fabric.js中创建的画布实例的位置 - How can I change dynamically position of instance of a canvas created in Fabric.js

How can I change dynamically position of instance of a canvas created in Fabric.js

我已经通过Fabric.js创建了一个画布实例。

var canInstance = new fabric.Canvas("drawCanvas");

当我在执行一些计算后改变它的位置时，画布位置似乎没有变化。

canInstance.left = "250px";
canInstance.top = "200px";

是否有办法动态地改变画布实例的位置?

fabric.getCanvas返回的画布对象不具有left和top属性。

您需要获得实际的DOM画布并修改其样式属性:

var canvasNode = canInstance.getElement(); //return the HTMLCanvasElement.
canvasNode.style.position = 'relative';
canvasNode.style.left = '250px';
canvasNode.style.top = '200px';

我已经将position属性更改为relative，因为默认情况下，元素具有position: static，这会导致布局引擎忽略top和left属性。如果你的画布有一个明确的定位(不同于static)，只需删除该行。