10 librerías de Javascript para crear mapas personalizados

La inserción de mapas se puede convertir en primordial según el tipo de proyecto que tengamos que desarrollar. Imaginemos pues, que tenemos que llevar a cabo un directorio de empresas en el que debemos geolocalizar cada uno de los negocios dentro del mapa. Lo primero es pensar en utilizar Google Maps, ¿verdad? Bueno, tenemos dos cosas que decirte: no todo se reduce a Google Maps y puedes valerte de una librería Javascript para simplificar la tarea.

En este artículo te mostramos 10 librerías de Javascript con las que crear mapas personalizados de una manera sencilla y fácil de comprender. No todas tirarán de Google Maps, por eso hemos puesto la fuente de origen, así como su licencia. Esperamos que sean de vuestro agrado.

GMaps

GMaps hace que añadir y personalizar mapas de Google Maps sea coser y cantar. Aparte de poder añadir mapas, puedes agregar elementos en el propio mapa, como polilíneas que pueden ser útiles para la elaboración de rutas, controles de menú especiales, e incluso elementos HTML.

GMaps es compatible con datos formateados con JSON que pueden ser utilizados para integrar tu mapa con aplicaciones de terceros, como Foursquare.

Fuente del mapa: Google Maps
Dependencias: ninguno
Licencia: Licencia MIT

jHere

En solo 5 KB, jHERE demuestra que el tamaño no importa; puedes construir mapas interactivos de gran calado mediante unas cuantas opciones de personalización. jHERE deriva la visualización de los mapas HERE map, uno de los proveedores de mapas más populares en Windows Phone.

La librería se puede ampliar con nuevas funcionalidades, y hay un par de extensiones interesantes que deberías conocer sí o sí, como la de añadir formas para crear rutas y otra para crear marcadores personalizados.

Fuente del mapa: HERE Maps
Dependencias: jQuery o ZeptoJS
Licencia: Licencia MIT

Kartograph

Kartograph consta de dos archivos, Kartograph.ph para generar el mapa en formato SVG y Kartograph.js para añadir elementos interactivos en la parte superior del mapa. Desde que Kartograph.js requiere de Raphael.js, el mapa funciona perfectamente en IE7 y versiones anteriores. Puedes echar un vistazo a las demos para descubrir lo que Kartograph puede hacer.

Fuente del mapa: Kartograph
Dependencias: Kartograph.py, Raphael, y jQuery
Licencia: AGPL y LGPL

Mapael

jQuery Mapael te permite crear mapas con una visualización de datos elegante, así como una interactividad asombrosa. Puedes, por ejemplo, crear un mapa y aplicar a cada región del mapa un color diferente en base a su situación. También puedes añadir tooltips sobre la región, así como controladores de eventos como clic o hover.

El mapa está desarrollado con el SEO en mente, al proporcionar contenido alternativo para aquellos robots de motores de búsqueda que no son capaces de rastrear el contenido generado por JavaScript.

Fuente del mapa: Raphael.js
Dependencias: jQuery
Licencia: Licencia MIT

D3js

D3.js es una librería de JavaScript que devolverá tus datos a la vida gracias a HTML, SVG y CSS. El uso D3 es bastante variado, como la construcción de mapas altamente interactivos. Échale un vistazo este mapa del Banco Mundial para el Desarrollo Global y podrás ver las posibilidades de lo que se puede construir con D3.js.

Fuente del mapa: D3.js
Dependencias: ninguno
Licencia: Indefinida

DataMaps

Si el crear un mapa con D3.js te resulta algo abrumador, puedes utilizar DataMaps. DataMaps es, esencialmente, un plugin de D3.js que se ha implementado especialmente para construir mapas. Hereda muchas características de D3.js, por lo tanto, te brinda la oportunidad de poder crear mapas simples o bastante personalizados con él. ¿He mencionado que los mapas son responsive?

Fuente del mapa: D3.js
Dependencias: D3.js y TopoJSON
Licencia: Licencia MIT

GeoChart

GeoChart es un Google Map simplificado que renderiza regiones, marcadores, y texto, en lugar de mostrar un mapa completo con todo lujo de detalles. El mapa se genera en SVG, y se puede personalizar de muchas maneras, incluyendo el cambio de los colores por región, insertando popups y marcadores personalizados.

Fuente del mapa: Google Maps
Dependencias: ninguno
Licencia: Leer Google Maps TOS

Maplace

Maplace, es un plugin de jQuery para generar mapas con la versión 3 del API de Google Maps. Maplace funciona en todos los navegadores, incluyendo IE6. Así que este es otro complemento a tener en cuenta si quieres generar un mapa de la forma más fácil posible.

Fuente del mapa: Google Maps
Dependencias: jQuery
Licencia: Licencia MIT

Stately

Stately es una librería JavaScript que se ha desarrollado expresamente para generar mapas de Estados Unidos. La librería es relativamenete ligera teniendo en cuenta que puedes añadir elementos interactivos en la parte superior de los mapas generados.

Fuente del mapa: Stately / SVG
Dependencias: ninguna
Licencia: Licencia de MIT

GeoComplete

GeoComplete es una librería de JavaScript distinta a las que te hemos mostrado anteriormente. Esta librería agregará un campo de texto junto al mapa, mediante el cual se podrán buscar ciudades, países o estados según vayas escribiendo.

Fuente del mapa: Google Maps
Dependencias: jQuery
Licencia: Licencia MIT

COMPARTE ESTE ARTÍCULO

COMPARTIR EN FACEBOOK
COMPARTIR EN TWITTER
COMPARTIR EN LINKEDIN
COMPARTIR EN WHATSAPP