Javascript 确定旋转矩形的坐标

我正在创建一个实用程序，它应该检测并报告图像中透明矩形alpha=0的角点坐标

到目前为止，我已经用Javascript+Canvas建立了一个系统，该系统显示图像，并在单击图像中透明矩形的内部时启动类似泛光填充的操作。它正确地确定了洪水填充操作的边界框，因此可以为我提供正确的坐标

到目前为止，我的实现是：在最近的Firefox/Safari中工作

但是，边界框方法会发生故障，然后透明矩形会顺时针或逆时针旋转，因为生成的边界框不再正确表示正确的宽度和高度。我试图想出一些替代方法来检测拐角，但没有想出一个合适的解决方案

---

那么，有没有人对我如何处理这一点有什么建议，以便我能够正确地检测旋转矩形的4个角的坐标？

我认为您可以通过对现有解决方案的简单扩展来实现这一点：沿着边界框的4条边中的每一条边行走，寻找透明像素：

在非旋转的情况下，沿长方体每个边缘的所有像素都将是透明的。 在旋转的情况下，必须有一个角接触长方体的每个边缘。这将位于距离边缘中间最远的透明像素处，由于混叠，可能会有多个像素，例如，如果矩形仅略微旋转。

---

我认为您可以通过对现有解决方案的简单扩展来实现这一点：沿着边界框的4条边中的每一条边行走，寻找透明像素：

在非旋转的情况下，沿长方体每个边缘的所有像素都将是透明的。 在旋转的情况下，必须有一个角接触长方体的每个边缘。这将位于距离边缘中间最远的透明像素处，由于混叠，可能会有多个像素，例如，如果矩形仅略微旋转。

---

这还不清楚。您的示例似乎正确识别了边界框。您在执行洪水填充时遇到问题吗？为什么这需要找到拐角？泛光填充通常通过查找边缘像素来工作，而不考虑几何实体。实际上，边界框工作良好，通过应用泛光填充算法来检测。但是，我需要矩形角的精确坐标，而不是边界框，我不知道如何解决这个问题，这还不清楚。您的示例似乎正确识别了边界框。您在执行洪水填充时遇到问题吗？为什么这需要找到拐角？泛光填充通常通过查找边缘像素来工作，而不考虑几何实体。实际上，边界框工作良好，通过应用泛光填充算法来检测。但是，我需要矩形角的精确坐标，而不是边界框，我不知道如何解决这个问题。这很好，Matthew。我几乎让它工作得很好，正如你所预测的那样，我只需要处理由于抗锯齿造成的不准确。谢谢太好了，马修。我几乎让它工作得很好，正如你所预测的那样，我只需要处理由于抗锯齿造成的不准确。谢谢