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

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

我需要知道的是，我想获取现在选择的多边形的鼠标坐标( Canvas 上的像素点)？

我试过:

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

但这给出了一些消极和一些积极的值(value)。

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

最佳答案

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

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 时才有效(否则也需要“旋转”点坐标)。

关于fabricjs - 如何在 Fabric.js 中获取多边形点，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/19854808/