编程语言
首页 > 编程语言> > javascript-使用平移和缩放计算画布中的绝对坐标

javascript-使用平移和缩放计算画布中的绝对坐标

作者:互联网

更改视口位置和缩放级别后,如何计算画布的特定位置(例如,底部中心)?

现在我正在尝试这样的事情.但这仅适用于视口.

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);

并且应该完成.
transformdP应该具有在缩放和/或平移视图中作为中心底部看到的点的绝对坐标.

标签:fabricjs,javascript
来源: https://codeday.me/bug/20191118/2031305.html