City Roads es una plataforma que te permite obtener mapas totalmente limpios para utilizarlos como quieras. ¿A qué me refiero con totalmente limpios? Pues sin nombres de calles, nombres de ciudades y demás textos. Únicamente la estructura de calles, carreteras y caminos, y en dos colores. Uno para todos estos elementos, y otro para el color de fondo. Esto genera una imagen super minimalista que guarda cierta belleza, la cual puedes utilizar para cualquier proyecto personal, e incluso para decorar tu hogar. Para ello City Roads utiliza la API de OpenStreetMap, una plataforma similar a Google Maps, pero Open Data, que es capaz de mostrar mapas en tiempo real. ¿El resultado? Podéis verlo vosotros mismos en la imagen que encabeza este artículo.
La herramienta te permite personalizar los colores del mapa. Es decir, nos otorga la posibilidad de modificar tanto el color de los elementos, como calles, carreteras y demás; así como el color de fondo. También nos permite modificar el color del nombre de la ciudad o zona que estemos visualizando. Este texto es el único que aparecerá en el mapa, y lo hará de manera muy estética.
Por último, también nos da la opción de exportarlo. Para ello tenemos unas cuantas opciones:
- Onto a mug: Esta opción de exportado es la más simpática de todas. Mediante ella podremos imprimir el mapa que estemos visualizando en una taza. Te recomiendo que pulses dicha opción para que veas el magnífico resultado. Si eres de los que admira una ciudad concreta, tener una taza con su mapa puede ser una opción muy a tener en cuenta.
- As an image (.png): Podemos exportar el mapa que estemos visualizando en ese momento como una imagen PNG.
- As a vector (.svg): Por último, City Roads nos da la opción de exportar el mapa como un vector en formato SVG. Ya sabéis que podéis redimensionar este tipo de archivo tanto como queráis. Nunca perderán calidad...
Según he podido ver, la interfaz de esta herramienta ha sido desarrollada con Vue.js. Ya os hemos hablado en anteriores ocasiones sobre Vue.js, un framework Javascript ideal para construir entornos frontoffice en un santiamén, con una comunidad muy viva. Después, como he comentado antes, obtiene la información gracias a la API de OpenStreetMap y renderiza el resultado con WebGL.
City Roads ha sido desarrollado por Andrei Kashcha @anvaka y, personalmente lo descubrí gracias a un artículo de microsiervos. Podéis inspeccionar el código libremente ya que lo tiene liberado en Github. Así podréis aprender cómo está desarrollado, así como proponer nuevas mejoras y corrección de bugs a su creador. Y por supuesto, si te ha parecido interesante, siempre puedes pagarle un café al desarrollador y animarle a continuar con su trabajo.
¿Te ha gustado City Roads? ¿Lo ves útil?