3

我有一个 Canvas 对象，其顶部和左侧属性是通过以前的 JavaScript 函数定义的，但是当我创建一个织物 Canvas 对象时

  var fabricCanvas= new fabric.Canvas('mycanvas');

我的 HTML 画布的顶部和左侧属性设置为 0。

在通过脚本创建织物 Canvas 对象后，我尝试设置顶部和左侧属性，但是当我这样做时，画布会改变位置，但织物功能（选择和移动功能）仍保留在画布之前所在的位置（织物 Canvas 的位置）定位它）！

我能做些什么来解决这个冲突？有没有办法保持画布相等？

4

4 回答 4

5

当您使用 Fabric.js 创建画布时，它会将其包装在一个 div 中并添加第二个<canvas>（用于选择在第一个画布中呈现的对象）。Fabric.js的wiki 页面对此进行了解释。如果您想定位您的画布，请将 CSS 规则应用于“canvas-container”类的父 div 元素。

于 2012-09-07T14:46:32.327 回答
0

从我相同的线程中回答

申请

margin: 0 auto;

到类 = 画布容器

canvas-container 是由 fabric 自动创建的。

见小提琴

于 2013-02-26T14:21:18.087 回答
0

您可以在初始化时覆盖 canvas-container 类，如下所示：

new fabric.Canvas('canvasId', {containerClass: 'custom-container-class'});

http://fabricjs.com/docs/fabric.Canvas.html#containerClass

于 2022-02-18T16:37:42.607 回答
0

Please notice that if your using some kind of css preprocessor (for me it was scss stylesheet inside Angular) - targeting the "canvas-container" class inside the component scss file will not work. For me the workaround was the general project css file.

于 2019-02-17T07:48:10.933 回答