Canvas JS 如何获取多边形的高度和宽度？

Question

我创建了一个小画布 js 脚本并在形状上绘制轮廓这是脚本

context.beginPath();
context.moveTo(coordinates[0].x, coordinates[0].y);
for (let index = 1; index < coordinates.length; index++) {
    context.lineTo(coordinates[index].x, coordinates[index].y);
}
context.lineWidth = 2;
context.strokeStyle = "red";
context.fillStyle = "rgba(255, 0, 0, 0.3)";
context.fill()
context.closePath();
context.stroke();

但我无法获得其形状的宽度和高度，实际上我想显示和线条作为工具提示供用户参考。

我在这里附上图片，您可以在 Dice 顶部看到黑线（我在 Photoshop 中为您做参考）。我想展示那条线。 我是菜鸟，如果有人可以帮助我提供很棒的示例代码。

Example image

Answer 1

您可以像这样获得最小/最大 X 和 Y：

var minx = coordinates[0].x, maxx = coordinates[0].x, miny = = coordinates[0].y, maxy = = coordinates[0].y;
for (let index = 1; index < coordinates.length; index++) {
  if (coordinates[index].x < minx) minx = coordinates[index.x]);
  if (coordinates[index].x > maxx) maxx = coordinates[index.x]);
  if (coordinates[index].y < miny) miny = coordinates[index.y]);
  if (coordinates[index].y > maxy) maxy = coordinates[index.y]);
}

您可以使用最小值和最大值计算高度和宽度。