使用平移计算画布中的绝对坐标&快速移动

Calculate absolute coordinates in a canvas with panning & zoom

本文关键字：amp 坐标 移动 计算 布中      更新时间：2024-01-03

在更改视口位置和缩放级别后，如何计算画布的特定位置（例如底部中心）？

现在我正在尝试这样的东西。但它只适用于视口。

canvasPoint = {
   left:(canvas.width/2)-canvas.viewportTransform[4],
   top: canvas.height-canvas.viewportTransform[5]
}

当我缩小或放大时，我无法找到画布的新中心底点。

您必须使用矩阵。你的下中角有坐标：

var p = {x: canvas.width/2, y: canvas.height};

您的缩放和平移由viewportTransfom:表示

var invertedMatrix = fabric.util.invertTransform(canvas.viewportTransform);
var transformedP = fabric.util.transformPoint(p, invertedMatrix);

你应该完成。transformedP应该具有在缩放和/或平移视图中作为中心底部的点的绝对坐标。

相关文章：