¿Existen otras opciones para habilitar un área en la que se puede hacer clic de forma irregular en una página web distinta a los mapas de imágenes?

Question

(Esta es una publicación que me estoy moviendo de ui stackexchange.)

Tenemos algunas áreas de forma irregular ... imagina un mapa de los estados de los Estados Unidos. Imagine también que dentro de cada estado hay una región rectangular que contiene gráficos y texto. Queremos hacer que cada uno de los estados reaccione al mouseover/mouseout/click.

Si se trata de una página HTML/Javascript directa (sin Flash), ¿hay otras formas de implementar esto que los mapas de imágenes?

Si esto no es posible, también consideraría simplemente hacer que la región rectangular dentro de cada estado reaccione a los eventos del mouse.

Answer 1

¿El "HTML directo" significa que puede usar Javascript? Si es así, considere el Raphael javascript library, que ajusta SVG. El registro de su página de inicio para una amplia visión de lo que puede hacer, incluyendo este ejemplo de condados de Australia (?): http://raphaeljs.com/australia.html

También podría considerar processing.js, que es una librería de visualización similar pero envuelve la lona en contraposición a SVG.

Answer 2

¿qué tal las coordenadas? tome su mapa de los Estados Unidos, descubra los polígonos que contienen un estado, y cada vez que el usuario haga clic en algún lugar, obtenga la posición del clic y descubra en qué polígono se encuentra esa posición.

la única parte difícil es hacerlo la traducción de lógico a físico. es decir, cuando obtiene la ubicación de un clic probablemente le proporcione la ubicación en el posicionamiento global del navegador, y deberá averiguar dónde está usando su imagen .position() de jquery.