html - KineticJS 将图像转换为梯形

Question

是否可以对图像应用变换以将其变换为梯形？

图像初始状态是一个矩形。我的场景构建方式，我有一个允许在边缘拖动的多边形，以及一个大小和位置相同的图像。

我希望图像具有与多边形相同的形状，因此当拖动一个多边形轴时它会变成梯形。这可能吗？

Answer 1

我假设您在谈论诸如等腰梯形之类的东西，而不是简单的矩形。

答案是否定的，但是是的……

不，不能使用 2D 变换 --canvas.getContext("2d")。这是因为 2d 变换使用 3x3 矩阵，它只进行并行变换。由于梯形是不平行的，因此您不可能将图像（矩形）转换为梯形。

但是，是的……您可以使用 webGL（canvas 3D 变换）进行非平行变换，因此您可以使用 canvas 3D 将图像转换为梯形。