konvajs - 线的缩放点 - konvajs

Question

我希望在 KonvaJS 线上进行转换。我已经完成了所有工作，并且可以缩放对象，但是我希望它可以调整线的点，而不是在我抓住调整大小手柄时设置 scale 属性。也会考虑在路径中执行此操作。

所以目标是我的对象 scaleX 和 scaleY 始终为 1，它只是扩展的点。

这是可能吗？

标签： konvajs

Answer 1

您只需要将比例应用于points属性：

shape.on('transformend', () => {
  const oldPoints = shape.points();
  const newPoints = [];
  for(var i = 0; i< oldPoints.length / 2; i++) {
    const point = {
      x: oldPoints[i * 2] * shape.scaleX(),
      y: oldPoints[i * 2 + 1] * shape.scaleY(),
    }
    newPoints.push(point.x, point.y);
  }
  shape.points(newPoints);
  shape.scaleX(1);
  shape.scaleY(1);
  layer.draw();
})

演示：https ://jsbin.com/vuhakuvoxa/1/edit?html,js,output