Определить координаты повернутого прямоугольника

Question

Я создаю служебное приложение, которое должно обнаруживать и сообщать координаты углов прозрачного прямоугольника (альфа = 0) в изображении.

До сих пор я установил систему с Javascript + Canvas, которая отображает изображение и запускает операцию, похожую на заливку, когда я щелкаю внутри прозрачного прямоугольника на изображении. Он правильно определяет ограничивающую рамку операции заливки и поэтому может предоставить мне правильные координаты.

Вот моя реализация на данный момент: http://www.scriptorama.nl/image/ (работает в недавних Firefox / Safari).

Тем не менее, подход ограничивающего прямоугольника разрушается, после чего прозрачный прямоугольник поворачивается (по часовой стрелке или против часовой стрелки), поскольку получающийся ограничивающий прямоугольник больше не отображает правильную ширину и высоту. Я пытался придумать несколько альтернатив для определения углов, но не смог придумать правильного решения.

Итак, есть ли у кого-нибудь какие-либо предложения о том, как я могу подойти к этому, чтобы я мог правильно определить координаты 4 углов повернутого прямоугольника?

Answer 1

Я думаю, что вы можете сделать это с помощью простого расширения существующего решения: пройтись по каждому из 4 краев ограничительной рамки в поисках прозрачных пикселей:

• В не повернутом случае все пиксели вдоль каждого края поля будут прозрачными.
• В повернутом корпусе должен быть один угол, касающийся каждого края коробки. Это будет прозрачный пиксель, самый дальний от середины края (их может быть больше одного из-за наложения, например, если прямоугольник повернут очень слабо)