使用 HTML5 Canvas 裁剪图像位置

Question

我有一个 640 像素 x 480 像素的图像，并且我有坐标，我想在其中创建图像的画布裁剪。我对如何计算 1、裁剪尺寸、裁剪位置等感到有些困惑。

如何计算出正确的裁剪位置和裁剪尺寸？例如从坐标设置画布的大小，如下所示

coordinates = [160, 593, 345, 407] // [top, right, bottom, left]

基本上是我从 Python 脚本返回图像坐标，但不知道如何计算出正确的位置。

Answer 1

drawImage() 方法接受源坐标和目标坐标的参数。

 context.drawImage(imageObj, sourceX, sourceY, sourceWidth, sourceHeight, destX, destY, destWidth, destHeight);