Una piccola macchina del tempo...

Che richiede un po' di pazienza ed applicazione per essere usata... ma credo ne valga la pena !!!

Dopo le precedenti puntate:

- Ricostruzione Mappe AST

- Georeferenziazione Mappe

questa volta l'obiettivo è quello di utilizzare la potente architettura software che permette la visualizzazione delle immagini in proiezione cilindrica di Google per popolare la città con le immagini storiche preferite... cosa che è già stata fatta da altri utilizzando delle sovrapposizioni statiche, quasi sempre utilizzando un 'panorama' unico da scaricare integralmente; con questa tecnica invece si ottiene un panorama veramente integrato con quello 'ufficiale', scaricato a 'mattonelle', perfetto a qualunque livello di zoom o punto di vista.

Occorrerà effettuare 4 passi:

FASE 1) 'Catturare' le molte 'mattonelle' che google streets utilizza per visualizzare il panorama, a tutti i livelli di zoom; ricostruire il panorama originale come 'scattato' dalla Google Car (che, tra l'altro, è normalmente interessante a prescindere!), e mantenere traccia di tutte le integrazioni 'storiche' effettuate in modo da poterle visualizzare in qualunque momento, ricercandole mediante markers sulla mappa bidimensionale

FASE 2) Sovrapporre le immagini preferite al panorama originale ricostruito, tenendo presente le distorsioni dovute alla proiezione cilindrica

FASE 3) Risezionare il panorama 'integrato' in mattonelle comprensibili dal motore di visualizzazione di Google Streets, per tutti i livelli di zoom

FASE 4) Godersi il risultato...

Il tutto come sempre in Windows, e utilizzando solo software libero e gratuito!

__________________

NOTA IMPORTANTE - Bisogna sempre essere connessi a Internet.

Innanzitutto bisogna installare i seguenti pacchetti (se non già presenti sul PC):

---> 0 . Google Chrome: https://www.google.com/intl/it/chrome/browser/

Purtroppo (o per fortuna :-) ) non funziona su Explorer... [non è ancora implementato completamente il FileReader di HTML5, e me ne sono accorto troppo tardi... magari in una prossima release faccio anche la gestione multi-browser...]

---> 1 . GIMP: download from SourceForge

---> 2 . Quantum GIS: http://qgis.org/downloads/QGIS-OSGeo4W-1.8.0-2-Setup.exe

(C'è una nuova versione, QGIS 2.2 Valmiera : http://qgis.org/downloads/QGIS-OSGeo4W-2.2.0-1-Setup-x86.exe , l'interfaccia è un po' diversa ma il concetto è lo stesso.)

(per l'installazione seguire i passi indicati nel tutorial sulla georeferenziazione mappe)

---> 3 . ImageMagick: http://www.imagemagick.org (ops... editato oggi 27/03/13... hanno cambiato il link!)

---> 4 . il mio programma... l'installer è in un file .zip (basta decomprimerlo e lanciare setup.exe).

StreetTileMagickByMQC.zip

UPDATE... Questa è la versione 2, che (come la 1.1 di qualche mese fa) corregge un paio di problemini in casi particolari e permette di abilitare un tracciamento da inviarmi se qualcosa non funziona... TileMagickByMQC.zip - Il precedente se già installato va prima DISINSTALLATO da pannello di controllo.

Per abilitare il tracciamento è necessario mettere un check sul nuovo checkbox 'DEBUG'. Verranno così creati durante l'esecuzione due files, con il nome del file di indice e estensione .trace e .DEBUG, che contengono il primo le informazioni rilevanti dell'esecuzione (e soprattutto il dettaglio di eventuali errori), il secondo le informazioni provenienti da sysinfo (tipo di sistema operativo, etc) e la versione di imagemagick.

(Utilizza .net 4.0, quindi probabilmente richiederà la connessione a Internet per scaricare da micro$oft tutti i prerequisiti.; è' una integrazione al precedente 'TileMagick'... così con lo stesso software accederemo sia alle tiles di AST che a quelle di Google... :-)

E infine:

---> 5 . la mia pagina html, MQCTimeMachine_html.zip (include css, javascript, etc) che permette la navigazione nel tempo... è un file zip insieme ad alcune piccole immagini che utilizza; va decompressa in ogni cartella all'interno della quale si trovi il file indice dei panorami modificati. (Sarà piu' chiaro alla fine...)

(Io consiglierei di creare una struttura gerarchica; avremo a che fare con MOLTI files, per cui cercheremo di mantenere il disco il più possibile ordinato. Per cui all'interno della cartella in cui decomprimeremo la pagina html, creeremo le cartelle in cui si troveranno tutte le nostre 'integrazioni'. L'indice sarà insieme alla pagina per la navigazione. Non è obbligatorio... ma è comodo.)

---> 6 . Ho anche preparato uno zippone con l'esempio completo qui descritto... Historical_example.zip

(Attenzione, sono più di 200MB!)

__________________

FASE 1

(Sto facendolo anch'io man mano che scrivo questa pagina... così non salto nulla...)

Trovare una foto adatta. La cosa è soggettiva... i risultati migliori si ottengono con fotografie frontali di un edificio, non troppo panoramiche (altrimenti il lavoro di manipolazione diventa lungo, e complicato), e con una risoluzione elevata. Comunque potenzialmente qualunque foto scattata al livello stradale, con un'angolazione il più possibile simile a quella della Google Car va bene... prendiamo per esempio questa, vergognosamente copiata da un forum che probabilmente conoscete... :-)) :

(è via Lagrange angolo Cso Vittorio)

Poi cerchiamo la stessa inquadratura su Google Maps / Street View, posizionandoci con l'angolazione più simile:

Clicchiamo sull'icona della 'catena', e copiamo il link risultante (in Chrome è necessario usare ctrl-c):

Poi lanciamo StreetTileMagick.exe, e inseriamo i seguenti dati:

- Google URI: Incollare il link appena copiato da Google Street View

- Delete tiles at the end: Si può anche mettere il check, tanto le tiles saranno ricostruite sulla base del panorama modificato. Io preferisco tenerle, tanto saranno sovrascritte, e averle ci permette di fare un 'primo giro' senza avere ancora modificato il panorama...

- Zoom level e check su Get single zoom level panorama: Se il check NON c'è, saranno ricostruiti tutti i livelli di zoom. Normalmente è da lasciare così, a meno che non si voglia selezionare un singolo livello per qualche motivo particolare.

- Destination Dir: Scegliere quella che sarà la cartella di più alto livello delle nostre 'integrazioni' (non dovrà essere necessariamente unica)

- Index File: Scegliere un nome adatto per il file di indice di tutte le integrazioni che saranno visualizzate all'interno dello stesso 'mondo' [ogni indice rappresente un 'tempo visitabile', per modo di dire; per esempio, se voglio avere più immagini di diverse epoche dello stesso edificio avrò bisogno di un indice per epoca]. Il check su 'Append new link' è normalmente da lasciare... altrimenti verrà SOVRASCRITTO L'INDICE!!!

(Consiglio vivamente di fare backup dell'indice abbastanza spesso...)

- Panorama name: Il nome 'base' dei panorami ricostruiti (i nomi finali avranno un numero da 0 a 5 prima di questo, uno per ogni livello di zoom)

- Comment: Questa riga verrà inserita nell'indice in modo da renderlo più leggibile, e poterlo eventualmente modificare a mano.

- Link string: Quello che verrà visualizzato sul nostro privato street view in corrispondenza della zona 'integrata'.

Poi premiamo su GetPanorama... e aspettiamo qualche minuto. Il software si occupa di contattare il tile server di Google, e richiedere tutte le mattonelle per tutti i livelli di zoom per il 'panoid=_bILO3YuCBBOG8--72SvEA', valore che identifica univocamente il panorama selezionato sul pianeta.

Alla fine comparirà il messaggio

e nella directory che sarà stata creata con lo stesso nome del panorama avremo la bellezza di 474 files, circa 20MB:

Tutti quelli chiamati PanoTile[...].jpg sono le mattonelle; a noi ora invece interessano i primi 5, che sono i panorami ricostruiti - questo per esempio è il panorama di livello 5, 5_ViaLagrangeCsoVittorio.jpg :

Nella directory base sarà stato creato il file index.txt:

Lasciamo per il momento aperto il programma StreetTileMagick.exe, altrimenti se lo chiudiamo dovremo reinserire un po' di dati più avanti.

__________________

FASE 2

Ora occorre 'sovrapporre' l'immagine storica a tutti e 5 i panorami (beh... a dire il vero 3, dal 3 al 5; Google fornisce tiles anche per gli zoom di livello 0, 1 e 2, ma in effetti Street View non sembra usarli; devo ancora capire quando e se servono).

Per 'spalmare' la foto su una proiezione cilindrica non ho trovato alcun software free... tranne uno! Vi ricordate QuantumGIS, per la georeferenziazione delle mappe storiche? Lo inganneremo... la 'mappa' di riferimento sarà il panorama, e la 'mappa' da ricollocare sarà la foto storica! (tanto poi scarteremo i metadati della georeferenziazione...)

(Andrò un po' veloce nella descrizione... se si scorrono le istruzioni del tutorial sulla georeferenziazione mappe ci sono tutti i passi nel dettaglio; qui serve qualche passo in meno...)

Lanciare QuantumGIS e con Layer/Add Raster caricare il panorama a zoom level 5 (il più dettagliato), in questo caso 5_ViaLagrangeCsoVittorio.jpg; il sistema di coordinate è ininfluente, per non complicarci la vita usiamo il default WGS84:

Poi lanciamo Raster/Georeferencer/Georeferencer, e da File/OpenRaster carichiamo la foto da sovrapporre, sempre con sistema di coordinate WGS84:

Poi prendiamo QUANTI PIU' PUNTI POSSIBILE... se la foto è MOLTO simile come inquadratura, angolo, etc. alla zona corrispondente del panorama ne possono bastare una decina, altrimenti molti di più. Questo è il lavoro più noioso...

Poi salvare i punti, e lanciare la trasformazione, usando i seguenti parametri (il Polynomial 3 mi dà i migliori risultati, perchè tende a deformare l'intera area senza creare artefatti; il resampling Lanczos migliora un po' la qualità delle immagini in B/W aumentando il dettaglio). Useremo come Target SRS sempre il sistema di coordinate WGS84 (qui corrispondente all'EPSG:4326).

L'immagine 'distorta' si chiamerà ViaLagrangeCsoVittorio_modified.tif, la si può salvare dove si vuole.

Come si può vedere, già in QGIS e prima del passaggio in GIMP il risultato è più che accettabile (e ci ho messo non più di 10 minuti a prendere i punti... forse però ne mancano un paio sul balcone in alto a sinistra e sul cornicione in alto a destra, sono un po' spostati... ma diciamo che va bene così...):

Salvare il progetto (non si sa mai che lo si voglia riprendere) e uscire.

LANCIARE GIMP...

Da File/Open, caricare il file ViaLagrangeCsoVittorio_modified.tif

Con click destro sul layer dell'immagine modificata da QuantumGIS, selezionare 'Add Alpha Channel', in modo da abilitare la trasparenza delle zone che andremo a CANCELLARE:

Selezionare il tool MagicWand, e dopo aver cliccato sui bordi neri, con il tasto CANC cancellarli... diventeranno trasparenti. All'importazione successiva saranno bianchi, poi si potrà decidere se eliminarli completamente o no dall'immagine finale.

Da File/Export, salvare l'immagine cambiando l'estensione in .jpg (cambia anche il formato). Così ci liberiamo di tutti i metadati della geolocalizzazione fittizia...

Ricordando però di mettere al massimo la qualità dell'esportazione:

Da File/Open, caricare il file 5_ViaLagrangeCsoVittorio.jpg.

Poi da File/Close All, chiudere tutto quanto (ignorare i messaggi di salvataggio, non occorre salvare il .tif.

--- " SOVRAPPOSIZIONE CON GIMP " ---

Da File/Open, aprire il primo panorama, 5_ViaLagrangeCsoVittorio.jpg

Zoomare sulla zona che interessa. Poi da File/Open As Layers caricare l'immagine creata da QuantumGIS e trasformata in jpg, ViaLagrangeCsoVittorio_modified.jpg :

Poi selezionare il tool di spostamento (a forma di croce)

e spostare il layer in modo che l'angolo in alto a sinistra sia posizionato approssimativamente sopra la zona da sovrapporre:

Cliccare sul layer dell'immagine in B/N, e settare l'opacirà intorno al 65%

Selezionare lo Scale Tool

Prendendolo per gli angoli, ridimensionare il layer in B/N in modo che corrisponda perfettamente al panorama di Google... servirà alternare lo scale tool allo spostamento, in modo da posizionarlo correttamente. Il problema in Gimp è che mentre si fa il ridimensionamento il layer diventa opaco... quindi l'operazione è un po' macchinosa e richiede pratica per essere fatta rapidamente.

Poi confermare con il tasto Scale, e settare la trasparenza finale al livello desiderato; se desiderato, aggiungere al layer anche qui un alpha channel, e come fatto prima cancellare i bordi bianchi, in modo che diventino veramente trasparenti :

Da File/Save salvare il progetto

Da File/Export, salvare il risultato (sempre mettendo al massimo la qualità dell'esportazione) sovrascrivendo il file originale 5_ViaLagrangeCsoVittorio.jpg . (Se non si è molto convinti del risultato ottenuto, conviene prima copiarsi il panorami originali da qualche parte, in modo da non dover rifare tutto...).

Il risultato dovrebbe essere qualcosa del genere:

RIPETERE TUTTA LA "SOVRAPPOSIZIONE CON GIMP" PER I PANORAMI DI LIVELLO 4 e 3... (4_ViaLagrangeCsoVittorio.jpg e 3_ViaLagrangeCsoVittorio.jpg)

Il livello 3 sarà il più difficile, perchè risulta molto sgranato all'ingrandimento necessario per la sovrapposizione. E' necessaria un po' di pratica...

(I panorami sono tutti un po' diversi tra di loro, a volte con bande nere... ma è normale!)

[mi rimane il dubbio che siano necessari anche i livelli 2, 1 e 0... ma c'è un modo per capire se qualcosa non va, che vedremo più avanti...]

__________________

FASE 3

Ora ricostruiamo le mattonelle del nostro panorama modificato...

Se il programma è stato nel frattempo chiuso, occorre reinserire almeno questi dati:

Click su PutPanorama, e attendere il solito messaggio di fine operazione...

__________________

FASE 4

A questo punto posizioniamoci sulla directory indicata come 'Destination Dir', e lanciamo MQCTimeMachine.html...

Verrà visualizzata una pagina vuota con un tasto in alto a sinistra:

Cliccando su 'SELECT', comparità un dialog che permette di scegliere il file di indice... nel nostro caso Index.txt:

Alla pressione del tasto Open, la pagina si aprirà su una 'specie' di Google Street (l'ho però rifatta completamente utilizzando javascript e le Google API v.3.0...), con in basso a destra una 'piccola' google map.

All'interno della google map, se si zooma con la rotella del mouse, si scopriranno tutti i marker delle posizioni indicate nel file di indice (per ritrovare i punti in cui si è inserita una immagine storica). In questo caso ce n'è solo uno...

La posizione iniziale della mappa sarà sempre quella del PRIMO marker indicato nel file di indice.

Tra i vari link di navigazione (ok, questo è un incrocio ben complicato), ne compare uno in più! Quello indicato in precedenza come Link String...

La sua DIREZIONE non è ben definita, al momento (vedere la lista delle cose da fare alla fine della pagina... :-/ ).

Cliccando su 'Prova attacco aereo', ecco quello che succede...

Da qui in poi, fino a quando non si cliccherà su 'Exit time machine', il panorama di Google sarà sostituito interamente dalle mattonelle create a partire dai livelli di zoom che sono stati modificati precedentemente in GIMP.

La foto è visualizzata a QUALUNQUE livello di zoom, direzione, inclinazione...

[Se dovesse 'sparire' a qualche livello di zoom, significherebbe che vengono caricate dalle GoogleAPI le mattonelle dei livelli 0,1 o 2 che non abbiamo modificato... ma non mi è mai successo. Nel caso... sovrapporre l'immagine in B/W anche a quelli e rifare il PutPanorama]

__________________

ANCORA DA FARE:

- Direzionare in modo più logico la freccia del link aggiunto e quella di Exit

- Evitare che la direzione dello sguardo cambi passando dal panorama Google a quello 'privato'

- Rendere ridimensionabile/massimizzabile la google map

- Attivare (probabilmente per gestire la google map) i pulsanti 'custom' in alto a destra (ora disabilitati) - Fatto su un pulsante 'mappa' - ora ingrandisce o ripìmpicciolisce la mappa; però dopo averla rimpicciolita sparisce l'omino... bisogna poi muoverla o zoomare. Da risolvere...

- Introdurre il campo di ricerca indirizzo

__________________

[---

Una raccomandazione... per non violare i termini di utilizzo di Google, è necessario che l'utilizzo dei panorami originali e di quelli modificati sia esclusivamente personale e locale (non si può renderli disponibili online o fare diventare tutto questo un sito). Anche per questo ho fatto in modo che il file di indice sia solo locale (ok, non ci vuole molto a modificarlo; comunque...).

Si potrebbe fare quello che si vuole se invece dei panorami di Google si utilizzassero panorami costruiti autonomamente con proprie immagini !!! Questo, se interessasse, potrebbe essere oggetto di un altro articoletto... anche perchè molte immagini notevoli non sono ragionevolmente sovrapponibili a Google Streets, per il momento (tipicamente nelle zone pedonali, come Piazza Castello) :-)

---]

Come sempre, sono disponibile per ogni suggerimento/richiesta/segnalazione di bug/correzione/etc...

BUON DIVERTIMENTO!!!

__________________

PS - Qualche nota tecnica:

1) Ho lasciato (commentati) nella pagina html i tracciamenti di debug; se riabilitati producono un output di questo tipo sulla javascript console di Chrome, utile per capire eventuali problemi:

2) Qualche nota sul file indice:

Per ogni panorama, la prima riga è il commento

La seconda riga è il link copiato da google

La terza riga (l'unica considerata perchè preceduta da '@'), contiene i parametri seguenti:

Directory di riferimento

Latitudine

Longitudine

Stringa da visualizzare nel link

Dimensione X delle tiles

Dimensione Y delle tiles

Dimensione X del panorama di livello 5

Dimensione Y del panorama di livello 5

Direzione della vista in gradi

Direzione del link di ingresso in gradi

Direzione del link di uscita in gradi

ID Google Panorama

 

HOME