cómo visualizar/depurar un mapa de imagen?

Question

Genero dinámicamente un mapa de imagen para una herramienta de gráfico que tengo.

Tenía la esperanza de poder establecer un borde o un color en las etiquetas de área para poder verificar que todo estuviera siendo generado con los coords correctos, pero un poco de investigación muestra que esto no es posible.

Entonces, ¿cuál es la manera más fácil de revisar mi mapa de imágenes es correcto? ¿Hay alguna herramienta de navegador que "visualice" las áreas?

Answer 1

¿Qué hay de usar JavaScript (y jQuery) para probarlo?

http://davidlynch.org/js/maphilight/docs/demo_usa.html

Este plugin resaltar áreas de mapa de imagen.

Answer 2

Nunca pensé que diría eso, pero este es uno de los pocos casos en los que Dreamweaver podría ser útil. Tendrás una interfaz, podrás trabajar con puntos de anclaje y establecer tu mapa de imágenes fácilmente.

Answer 3

Puede utilizar FireBug para ello:

• Haga clic derecho en la imagen y selecciona "Inspeccionar elemento con FireBug"
• En la ficha HTML de Firebug, la etiqueta image se destaca: localizar y ampliar el asociada map etiqueta, que por lo general es justo después de que
• ahora puede colocar el puntero del ratón sobre cada uno area etiquetas para verlos destacó sobre su imagen

Answer 4

Image Map Editor es un complemento para Firefox. Es la mejor herramienta que he encontrado hasta ahora, hace que crear, inspeccionar y editar mapas de imágenes sea muy fácil.

Answer 5

Una forma de visualizar una etiqueta de área en Chrome es agregar tabindex a la (s) etiqueta (s) area que desea ver, y luego hacer clic o tabular en ella. Chrome resaltará muy bien el contorno real del área en la que se puede hacer clic.

Desafortunadamente, esta solución no funciona en Firefox.