Io odio i WebGIS, ma adoro i wallpaper con le mappe >> Quante volte avete cercato di salvare una mappa da mettere sullo sfondo del vostro desktop?
Io parecchie e mi trovavo sempre a dovere ispezionare la pagina per togliere div e testi aggiuntivi! Bene, così l'altro giorno mi sono messo a scrivere un po' di codice e sono riuscito ad ottenere uno strumento comodo e semplice da usare.
L’idea di partenza che mi ha permesso di immaginare l’applicazione è Leaflet-providers preview sviluppata e messa su GitHub da Jan Pieter Waagmeester aka jieter che permette di visualizzare un lungo elenco di mappe base, messe a disposizione dai vari Providers.
Ho spesso usato questa mappa di jieter, sia per trovare delle mappe base adatte per le mie web map, sia per fare degli screenshoots.
webapp/wallmapper
Ho basato l’applicazione che vi mostro in questo articolo sulla libreria LeafletJS e ho utilizzato il linguaggio jQuery, per interagire con la pagina web in base agli input degli utenti. Le principali funzioni sono le seguenti:
- è possibile scegliere la mappa di base tra molti esempi
in alto a sinistra, cliccando su “more” apparirà un elenco dei layer disponibili
- in questo elenco è sviluppato con la libreria DataTableJS ed è possibile fare una ricerca per titolo del tile, estensione e tag
- a destra c’è un pannello di controllo, dove dei bottoni permettono di abilitare o disabilitare delle opzioni
- visto che l’applicazione è fatta per fare screenshoots, in questo pannello di controllo, si possono disabilitare il box dei crediti, così si ha solo la mappa a tutto schermo
- le stelline, che si possono spegnere, rappresentano tutti gli screenshots, fatti dagli utenti e cliccando su una stella, è possibile sapere le coordinate, lo zoom e il layer che è stato salvato da qualche utente
- ci sono altre quattro opzioni attivabili, ovvero dei layer aggiuntivi da integrare alla mappa di base scelta
- si può accendre la heat map dei percorsi registrati con Strava
- si può accendere in trasparenza il rilievo del terreno
- infine due layer “admin” per vedere i confini amministrativi e/o le etichette, per quelle basemap dove non è chiaro o assente questa informazione
L’idea di questa mappa è sia quella di avere un elenco di mappe base fruibili, che già è possibile avere con Leaflet-providers preview, sia rendere un servizio di conoscenza e di report.
Se un layer non viene caricato, magari perchè la fonte è obsoleta, è possibile segnalarlo, tramite un semplice form.
La parte che riguarda i social network è attualmente in sviluppo, perchè verrà creato un post sul mio account Twitter, che segnala ogni “Screenshot taked” in modo anonimo.
I pulsanti Tokyo, Londra, New York e Mt. Everest, servono per dirigersi in un click per vedere come sono rappresentate sulla mappa questi luoghi “famosi”. Interessante vedere il Mt. Everest con il rilievo DEM.
Un Ester Egg: se ispezionate la pagina e aprite la console di LOG, è possible vedere in ordine cronologico, tutti gli “Screenshot taked” ed inoltre se inserite:
wallmapper/?lat=-25.7603&lng=-52.4268
con le coordinate, è possibile ottenere un permalink, facile da condividere.
OpenSource
Su GitHub ho condiviso i file di questa applicazione, ma è necessaria anche una breve spiegazione. Il link è il seguente github.com/pjhooker/basemaps e troverete:
- gistips_bassemaps.js > array 1 con la lista dei layer disponibili con descrizione e url
- gistips_bassemaps_list.js > array2 con solo la lista dei layer disponibili
- walmapper > la mappa sviluppata con LeafletJS, jQuery e PHP
In questo video tutorial vi mostro il funzionamento, che in pochi minuti, vi permette di avere uno wallpaper fullHD, con tante mappe da scegliere.
https://www.youtube.com/watch?v=gyc0o7UwOnw
