tag sirve que para online mapa imagenes imagen etiqueta crear color cambiar html5 canvas imagemap

sirve - ¿Canvas(HTML5) tiene el equivalente de un mapa de imagen?



mapa de imagenes html (5)

Incluso si no existe, ¿no obtendría un mapa de imagen en una imagen transparente sobre un lienzo lo que necesita?

¿El elemento Canvas tiene el equivalente del mapa de img , por lo que puede definir áreas clicables en el elemento canvas?

Hay una breve mención de un mapa a la mitad de la página aquí: http://www.w3.org/TR/html5/the- canvas- element.html , pero no puedo encontrar nada más al respecto.

¿Has considerado usar svg en lugar de canvas? Con svg, el gráfico en sí puede contener toda la información que necesita para identificar regiones activas, y puede adjuntar manejadores de eventos como lo haría con los elementos html.

Algunos ejemplos de cómo puedes detectar mouseevents en diferentes partes de la geometría de las formas svg:

http://dev.w3.org/SVG/profiles/1.1F2/test/harness/htmlObject/interact-pevents-08-f.html

http://dev.w3.org/SVG/profiles/1.1F2/test/harness/htmlObject/interact-pevents-09-f.html

Como solución a su problema: adjuntaría un evento de clic al lienzo y en el evento del mouse examinaría las coordenadas del mouse, luego una simple lista de áreas combinadas con polígonos con las que podría realizar algún tipo de prueba de colisión. Los rectángulos serían un comienzo, pero si realmente necesita áreas especiales, se debería hacer una prueba de colisión más avanzada.

Una solución rápida que he utilizado en Flash para mapas de precisión de píxeles, es crear un segundo mapa de bits superpuesto oculto, que utiliza para la búsqueda cuando alguien hace clic en la imagen visible.

Es la misma técnica utilizada en los viejos juegos de aventuras. Cada "área / objeto / enlace" tiene su propio color de píxel. Y luego solo mantienes la lista de objetos con el color correspondiente.

Una vez que tenga pixelcolor bajo el mousecoord, podrá hacer una búsqueda muy rápida en la tabla ... y bingo ...

Primero borra la "imagen de clic" con cero (negro) y eso es igual a "sin enlace", luego dibuja cada área con un color especial y almacena este color en la lista.

Pregunte si necesita más ayuda. Espero que esta haya sido una respuesta útil.

Echa un vistazo a Cake . Es un plug-in de gráfico de escena para lienzo. Puede ser un poco demasiado complicado para lo que está buscando, pero puede agregar eventos a los objetos de lienzo envueltos en Cake.