He estado buscando en todas partes pero no pude encontrar una respuesta. Necesito dibujar polígonos redimensionables con interacción con el mouse, pero no quiero polígonos irregulares, superpuestos o que se crucen al final.

Aquí hay un ejemplo simple de dibujar polígonos redimensionableshttp://www.wolfpil.de/polygon.html

Puede crear y cambiar fácilmente el tamaño de los polígonos, lo cual es genial. Pero necesito una funcionalidad adicional para detectar intersecciones y NO permitir formas / polígonos de aspecto extraño. Puedes ver el problema en este video:http://www.youtube.com/watch?v=zou2jcGM8zw

La única solución para ese problema que encontré enhttp://www.wikimapia.org. Han agregado características para manejar el problema. Puedes verlo en este video:http://www.youtube.com/watch?v=K7-K0k2D-2A

Pasé 3 días intentando lograr algo como esto. He revisado el código javascript de wikimapia pero es demasiado complejo para que lo entienda.

En resumen, no tiene que parecer tan elegante como el de Wikimapia. Solo necesito polígonos redimensionables que NO se cruzan al cambiar el tamaño o agregarle nuevos puntos. ¿Me puede dar alguna sugerencia sobre cómo lograr eso?

Gracias de antemano.