Javascript 在画布中查找多边形的坐标

我在画布上画了几个多边形。我现在对如何找到选定多边形的坐标（顶点）感兴趣。我可以使用鼠标坐标找到选定的多边形（区域），但如果它被选中，我需要重新绘制它，这就是为什么我需要它的坐标来做这件事

---

到目前为止，我发现一个类似的答案是使用GeoGebra，但我使用的是HTML5和JavaScript

一旦你在画布上画了东西，除非你有一些图像处理算法，否则你就无法得到你画的物体的坐标

相反，您需要将在画布上绘制的多边形对象保留在内存中，并且需要在画布上定义其边界

---

这样，当用户在画布上单击时，您只需在画布上获取鼠标坐标，然后通过检查多边形的绘制位置和鼠标单击是否进入该多边形的边界来计算单击的多边形。

听起来您正在尝试解决两个不同的问题：

1） 找出用户单击的多边形。如前所述，如果您在内存中保留多边形数组，并且可以实现

isPointInPath

方法，那么您可以在内存中的多边形中循环，并检查是否单击了其中任何多边形。不要忘记，为了得到准确的检查，您可能需要获取给定的“鼠标x”和“鼠标y”坐标（例如，从单击事件中），然后减去画布的页面x和y坐标

（有关更多详细信息，请参见SO答案。）

2） 确定用户已单击多边形p后，您希望重新绘制它。您应该能够毫无问题地重新绘制它，只需使用与以前相同的坐标重新绘制相同的多边形（例如，您可以将

笔划样式

或

填充样式

更改为不同的颜色来表示选择）

如果您想使多边形变大并处于相同的位置，这是一个不同的问题-基本上，您需要将画布平移到多边形的中心，然后缩放画布，然后绘制多边形。如果这对您来说是新的，在上有一个教程（使用图像而不是多边形，但概念相同）

请注意，如果多边形很复杂，即使确定要缩放的正确点也可能很困难。“复杂多边形的中心是什么”这个问题有几个不同的答案；一个简单的答案是平均所有多边形点的X和Y值（中心X=平均值（X），中心Y=平均值（Y））。如果这看起来不对，那么在另一个SO问题中还有更复杂的方法

---

希望这能为你指明正确的方向

@mpm我想你是在贬低我的问题，因为我没有提供一个可复制的例子：但没有！很容易找到isPointInPath，但是如何使用该信息缩放选定的多边形，而不将其从画布上丢弃。。。？这是我的想法。谢谢，罗特诺茨。我非常理解获取iPointInPath的部分，但是我需要重新绘制选定的多边形以进行缩放，而不会将其从画布上扔掉。我猜如果我有坐标，我会比较到画布边缘最近的距离来重新绘制它…非常感谢@Elliot！你正好违反了我的要求。我已经猜出了第一部分。第二部分很有挑战性，但你的推荐信很好。因此，我会接受这个答案。请注意：在使用AdobeFlash之前，我已经解决了这个问题，这比我在HTML5中看到的复杂性要容易得多，为了时间起见，我现在将回到我的Flash项目。我想使用Flash更容易，因为多边形已经是图像，而不是一堆坐标。