Question

我有像波纹管一样的简单路径。据我所知，它应该粘在画布的左上角。但是我把它渲染到了中间的某个地方。结果，我渲染的所有路径似乎都从原始位置移开。我错过了很明显的东西吗？我使用fabric.js进行所有画布操作。任何线索都非常感激。

path1 = new fabric.Path('M 0 0 L 300 100 L 200 300 z');

Answer 1

虽然Fabric gotchas声明：

所有对象（包括组）的左/顶值对应于对象的中心，并且相对于画布的左上角。基于中心的原点是默认的，但您可以通过对象的originX / originY属性更改它。

这不是问题。因为路径也不总是正确居中。

问题是path的定位错误：bug #1363。

该错误修复已完成，但不幸的是，这还不是他们最新版本的一部分（1.4.11）。所以我认为你有两个选择：

要解决此问题，您可以将 left和top 或 originX设置为零和originY 。

例如：

var path1 = new fabric.Path('M -100 0 L 50 0 L 100 100 z');
path1.set({ left: 0, top: 0 });

或者：

var path1 = new fabric.Path('M -100 0 L 50 0 L 100 100 z', {originX: 0, originY: 0});