javascript - 使用 setViewportTransform 翻转 y 轴时渲染损坏 (fabric.js)

Question

在我们的项目中，我们将使用不同坐标系([0,0] = 左下角)的复杂图像对象转换为fabric.js 对象。我们尝试使用 setViewportTransform 并在比例 y 上使用负值来实现此目的，但遇到了一些奇怪的行为。

例如，给定以下代码:

const canvas = new fabric.Canvas('c');
const path = new fabric.Path('M 0 0L 0 100 L 100 100 z');
canvas.add(path);
canvas.setViewportTransform([1, 0, 0, -1, 0, 300]);

当您尝试移动路径时，在某些位置它会完全消失。

我们是否做错了什么，或者是否有其他方法来实现我们正在寻找的目标？

Here是一个显示问题的 fiddle 。

Answer 1

你可以这样做。使用flipY属性翻转内容并调整顶部位置。 http://jsfiddle.net/ejmw1sbp/