如何在Fabric.js中获取多边形点

Question

我通过在画布上捕获鼠标点击然后将这些点传递给fabric.Polygon来绘制多边形。所以，通过这种方式，我绘制了多个多边形。

我需要知道的是，我想获得现在选择的多边形的鼠标坐标（画布上的像素点）？

我尝试过：

canvas.getActiveObject().get('points');

但是这给出了一些消极的和一些积极的价值。

那么，请你告诉我找出多边形点的方法吗？

Answer 1

多边形点相对于其中心，因此您可以像这样获得“绝对”位置：

var polygon = canvas.getActiveObject();

var polygonCenter = polygon.getCenterPoint();

var translatedPoints = polygon.get('points').map(function(p) {
  return { 
    x: polygonCenter.x + p.x, 
    y: polygonCenter.y + p.y
  };
});

让我们看看它的外观：

translatedPoints.forEach(function(p) {
  canvas.getContext().strokeRect(p.x-5, p.y-5, 10, 10);
});

我认为这只有在多边形的角度为0时才有效（否则也需要“旋转”点坐标）。

Answer 2

从2.0版开始，他们更改了多边形的坐标。相对于多边形中心2.0点之前；在2.0之后，它们对于画布是绝对的；

查看我对类似问题https://stackoverflow.com/a/53710375/4681279

的回答