Fabric JS 在图像容器内移动图像

Question

好的，我需要一个功能，我需要能够在图像本身的框架内正确定位图像。

正如您在图像中看到的那样，图像容器的大小是固定的，如果图像比框架本身大，我需要能够在框架内重新定位图像。我尝试用矩形裁剪图像并将图像定位在矩形内，但剪辑创建了一个等于矩形大小的新图像，因此到目前为止它还没有奏效。 fabric.Image class 中是否有任何属性让我们在里面移动图像位置？太胖了，我一直找不到。非常感谢任何帮助。谢谢

Answer 1

自 Fabric.js v2 起，可以使用以下四个属性的组合来完成图像裁剪：width、height、cropX 和 cropY。 (http://fabricjs.com/v2-breaking-changes#image)

例如，原始尺寸为 500x500 像素的图像可以中心裁剪为 300x300 像素，如下所示：

img.set({
  width: 300,
  height: 300,
  cropX: 100,
  cropY: 100
});

Fabric JS 在图像容器内移动图像

Fabric JS move image inside the image container

fabricjs