Se muestran 4 plugins de pago/gratuitos para dibujar mapas vectorizados con HTML nativo en nuestra web a través de jQuery.
Los mapas son un recurso fundamental en algunas aplicaciones en las que se requiera saber la ubicación de algún ente pero que no necesariamente deseamos que sea exacta -como en el caso de Google Map- si no solo obtener el país, región o estado de una forma gráfica.
Existen muchos plugins para pintar mapas mundiales, continentales, regiones, estados y en esta entrada veremos algunos de ellos.
El vector es el rey
Un punto común en todos los plugins para pintar mapas que veremos aquí, es el uso de los vectores como tecnologías fundamental para pintar los mapas; esto lo puedes corroborar viendo el código fuente de los mapas:
Y que todos los plugins para dibujar mapas emplean jQuery:
jVectorMap
jVectorMap es una interesante obción para pintar mapas; verás que puedes aplicar zoom sobre las diferentes secciones que conforman el mapa y estas no se pixelan (y es una características fundamental en los vectores); en general permite:
Mapa del mundo:
Mapa por país y sus estados:
Inclusive por regiones que definamos:
La única pega, es que es de pago para proyectos comerciales, ver más sobre la licencia en el siguiente enlace.
World Map Generator
El plugin World Map Generator nos brinda algunas opciones menos que el plugin anterior ya que no nos permite visualizar los estados de un país (un nivel de detalle menos) ni hacer zoom, aunque debes de tener en cuenta la licencia para incorporar en nuestros proyectos; para este caso es MIT:
jQuery Mapael
Este plugin jQuery Mapael tiene muchísimas opciones para personalizar los mapas; permite seleccionar por países, estados, regiones e inclusive podemos incorporar otros gráficos y textos para enriquecer más el contenido:
Entre otras cosas como el manejo de eventos; su licencia, MIT.
HTML5 Interactive Maps
HTML5 Interactive Maps ofrece tambien várias modalidades para ver los mapas por paises, sectores inslusive permite agregar capas de información sobre el mapa, entre otras opciones de personalización; lo malo, es de pago y bastante costoso:
Desarrollo con Laravel, Django, Flask, CodeIgniter, HTML5, CSS3, MySQL, JavaScript, Vue, Android, iOS, Flutter