Mapas Interactivos en HTML Usando Imágenes SVG

¡Hola! Esto es Código JS. En este vídeo (video tutorial) les vengo a enseñar cómo interactuar con imágenes SVG mediante HTML, CSS y JavaScript, de forma muy sencilla. Añade dinamismo a tus sitios web gracias a este tipo de imágenes.

Soy Javier Sanz, un joven apasionado por la programación web y todo lo que esta rodea. Cuento con titulación en CFGS de Desarrollo de Aplicaciones Web y domino tecnologías como PHP, JavaScript, MySQL, CSS...

Me encanta la sensación de constante aprendizaje, por eso siempre estoy estudiando y programando con nuevos lenguajes y framework, como bien pueden ser Vue, React o Symfony. Es por eso que he creado este canal, para poder ayudar a otros con mis tutoriales o a aquellos que están empezando en la programación y no saben muy bien qué camino escoger.

Siéntete más que bienvenido a unirte y formar parte de este canal, preguntar dudas y conocer a más apasionados de la programación. Todo aquí, en Código JS.

#html #svg #css #frontend

[luisaramirez]

Super util este video, gracias por el tutorial!!

[EnBuenChileno]

Me parece haber visto a alguien que modificaba el SVG desde enlace sin tener que incrustar todo el código en el HTML. Lo hacia desde el CSS con un metodo @... El problema es que no recuerdo ahora cual era ese video :(

[CalabazaCognitiva]

Excelente vídeo. Me sirvió al pelo. Cuestión; me dejó de andar, hace poco tiempo. ¿Podrá ser por una cuestión de orden de los cierres de las tag's " </path>" y "</a>"?
O sea; claramente es una cuestión de cierre de las tags -porqué me lo especifica la consola- ahora; ¿solo a mi me pasa? ¿o fue un cambio en general? ¿si cambio el orden y cierro "</path>" antes de " </a>" me andará?
No quiero sonar pesado, pero me interesa mucho la respuesta, aún más viniendo de personas que tienen más experiencia en el ámbito.

Desde ya; agradezco la respuesta y felicito por el vídeo.

[ArthurK]

hola, muy buen tutorial, una pregunta. ¿ Es posible cambiar los estilos del texto que sale al poner el mouse encima para que se vea mas grande o de otros colores? NO encuentro como hacerlo xd

[damiancontreras]

Buenas, aparte del mapa interactivo por zona se podrá poner indicadores tipo pines de zonas o hacer zoom de la zona que se le hace click?

[nicolastorterolo]

Buen video! Como tendria que hacer si quisiera que en vez de mostrarse una pagina web, me redireccione a otro sitio creado por mi, dentro del mismo proyecto? Por ejemplo un apartado donde se muestren siertos lugares dentro de una provinicia o region seleccionados. Gracias y saludos!

[franinclan]

Es posible dejar las provincias de interés de un color y que el hover solo afecte a esas provincias??

[nemachtianianequi]

puedes ayduarme a crear un mapa interactivo de nicaragua para mostrar datos estadisticos de poblacion para una clase de geografia, por favor. gracias

[oscarxaidejokerizo]

tremendo truco, solo funciona con imágenes SVG??

[TomoyoChan]

Me pasó que al colocar el enlace el lugar seleccionado se volvió negro, alguna sugerencia para que esto no pase?

[walney]

muito bom, tem como criar um app com js ?