Slides Tesi Pasturenzi Francesco

Politecnico di Torino
Corso di Laurea in Ingegneria Informatica
Progettazione di mappa
geopolitica per YouTrend
Politecnico di Torino - Tesi di Laurea Specialistica
Pasturenzi Francesco
1
Introduzione
L’elaborato
la dicreazione
La “Mappa riguarda
geopolitica
YouTrend”di è un
il
applicativo
webtirocinio
progettato
per 6evidenziare
risultato di un
durato circa
mesi.
l’andamento dei partiti politici dal 1946 al 2008
stato un progetto chiavi in mano e mi
inE’Italia.
sono occupato:
Tale
applicativo
stato acquistato
dalla storico
società
 della
parte dièscraping
dei dati dallo
YouTrend.it
che si eoccupa
di analisi
del Ministero dell’Interno
dei file KML;
geopolitiche e consulenza nell’ambito politico.
 progettazione
e realizzazione dei tre
database;
Per
progettare tale applicativo sono stati
utilizzati
i dati
estratti
dal Ministero dell’Interno
 del lato
server
e client;
aggregati
a livello nazionale, regionale,
 interazioni con il cliente per la risoluzione di
provinciale, comunale e inseriti su una cartina di
problemi
riguardanti
per lo adattata
più l’aggregazione
Google
Maps
appositamente
allo scopo.
dei dati.
Politecnico di Torino - Tesi di Laurea Specialistica
Pasturenzi Francesco
2
Obiettivi raggiunti

creazione di un innovativo
consultazione politica;

connettività multipla e simultanea senza un drastico calo delle
prestazioni grazie all’uso di tabelle di cache;

applicativo
web
di
facile
l’ideazione di un nuovo modo di consultare dati politici
differente dalla classica tabella o lungo elenco ma attraverso
una vera e propria mappa colorata in base al partito vincente;

possibilità di conoscere la distribuzione politica attraverso la
sola colorazione sfumata delle singole aree sulla mappa;

utilizzo delle API di Google Maps in un modo del tutto nuovo.
Politecnico di Torino - Tesi di Laurea Specialistica
Pasturenzi Francesco
3
Alcune Videate:
Grafico della
ZOOM
Mappa
con
di
TUTTI i
TUTTE
SELEZIONATO
sull’andamento
COMUNI
mappa
le
PROVINCE
REGIONI
di del
della
TUTTI
deldel
ili
dellapartiti
PROVINCIA
COMUNE
dei
1946.
COMUNI
2008
1946
REGIONE
colorate
in
modalità
tra
del
di lein
SELEZIONATA
interesse.
diverse
1946.
base
DISTRIBUZIONE
allearee della
1946.
gerarchia.
(tempo
COALIZIONI.
del
partito
di “PCI”.
(destra)
attesa
intorno ai 120
Grafico per anni di
secondi)
elezione.
(in basso)
Politecnico di Torino - Tesi di Laurea Specialistica
Pasturenzi Francesco
4
Tecnologie e Frameworks
utilizzati
Per la progettazione sono state utilizzate principalmente le API di
Google Maps versione 3 insieme alle seguenti tecnologie e
Frameworks:
Java J2EE per tutta la parte di back-end, utilizzo dei DTO e DAO
per il reperimento dei dati dal database e passaggio dei risultati al
client;
 Framework Struts 2 per la mappatura delle chiamate back-end
(lato server) con la parte client. Vengono mappate le varie JSP con
le Action associate;
 Framework Spring per IOC (Inversion Of Controls) cioè
automatizzazione del ciclo di vita degli oggetti. L’inizializzazione di
oggetti tipo Hibernate, JDBC e Web Server è demandata a Spring e
vengono utilizzati come proprietà, cone metodi get() e set().

Politecnico di Torino - Tesi di Laurea Specialistica
Pasturenzi Francesco
5
Tecnologie e Frameworks
utilizzati
Hibernate per ORM(Object Relational Mapping), cioè per la
mappatura della base di dati in classi Java. Utilizzo dei DAO;
 JDBC per l’accesso diretto al database MySql;
 JavaScript e JQuery per l’utilizzo delle API di Google Maps,
Google Charts e per la realizzazione di effetti grafici e sliding;
 AJAX+JSON per l’interazione tra client e server in CrossDomain nello scambio di messaggi per il popolamento della
mappa e dei vari grafici in base ai filtri scelti dall’utente.
 HTML5 + CSS3 per il layout e stile dell’applicativo. Sono stati
inseriti anche dei commenti condizionali per la risoluzione dei
problemi tra i browsers e per il riconoscimento dei dispositivi che
supportano WebKit.

Politecnico di Torino - Tesi di Laurea Specialistica
Pasturenzi Francesco
6
Ambienti di sviluppo e analisi
dei dati
Come ambienti di sviluppo sono stati scelti:
 Eclipse IDE J2EE e MySQL;
 SqlYog per i test delle query SQL utilizzate e per backup;
 PhpMyAdmin per la gestione remota e locale del database;
 Tomcat 6.0 come Web Server.
Per l’ analisi dei dati sono stati creati dei grafici utilizzando le API
di Google Charts Tools. E’ stato possibile così evidenziare
l’andamento dei vari partiti politici nei vari anni richiesti
dall’utente per una specifica area geografica.
Politecnico di Torino - Tesi di Laurea Specialistica
Pasturenzi Francesco
7
WebScraping (o parsing)
Per il reperimento dei dati dal sito del Ministero dell’Interno sono
stati creati degli appositi parser che importavano il contenuto dei
link attraversati, nel database di supporto e backup “Elezioni”.
La creazione del parser è stata abbastanza complessa perché le
pagine del Ministero dell’Interno sono state strutturate in modo
diverso negli anni:
dal 1946 al 1992, la struttura del layout è divisa in: Area,
Circoscrizione, Provincia e Comune.
 dal 1994 al 2001 è diventata: Area, Circoscrizione, Collegio e
Comune.
 dal 2006 al 2008 invece è uguale al 1946–1992, però con le
coalizioni: destra, sinistra e centro.

Politecnico di Torino - Tesi di Laurea Specialistica
Pasturenzi Francesco
8
WebScraping (o parsing)
Al cliente interessavano i dati aggregati a livello di comune,
provincia, regione e nazione.
Parser Java
Database di supporto e backup: ”Elezioni”
Database finale: ”Elezioni_RPC”
Aggregatore Java
 come tecnologia si è scelto di usare DAO-Hibernate.
Politecnico di Torino - Tesi di Laurea Specialistica
Pasturenzi Francesco
9
Passaggio dei valori
Client-Server
Lato client:
 chiamate Ajax per rendere più fluida la consultazione facendo
reloading parziali;
 tecnologia JSON per risolvere il problema di Cross-Domain tra il
sito YouTrend (“front-end”: index.html) e il web server Tc-Web (
“back-end” + database).
Lato server:
 utilizzo di Java J2EE + Struts 2 (ActionJSP) + JSTL
Lato database:
 utilizzo di DTO-JDBC lato consultazione della mappa;
 utilizzo di DAO-Hibernate lato amministratore.
Politecnico di Torino - Tesi di Laurea Specialistica
Pasturenzi Francesco
10
Passaggio dei valori
Client-Server
redirect su JSP-JSTL
chiamata delle ACTIONJava
<j:array items="${regioniZG}" var="regione">
<j:object>
<j:property name="data" value="${regione.data}" />
<j:property name="coordinate"
value="${regione.coordinate}" />
<j:property name="legenda_colore"
value="${regione.legenda.colore}" />
<j:property name="legenda_partito"
value="${regione.legenda.partito}" />
……
ACTION mappate con le
JSP tramite Struts 2
tramite AJAX-JSON
rispostaAJAX_RegioniTutte
(“ExtraAction_regioniTutte.action?
parData="+parametro_data);
private List<DescrizioneDTO>
regioniZG = new ArrayList<DescrizioneDTO>();
/*creazione dei GET e SET*/
…
public String regioniTutte(){
…
for (RegioneIstatDTO regioneJDBC : regioniJDBC) {
…
DescrizioneDTO r = new DescrizioneDTO();
…
regioniZG.add(r);
}
…
return "regioniTutte";
}
…
<action name="ExtraAction_*" method="{1}"
class="tp.web.ExtraAction">
<result name="regioniTutte">
/WEB-INF/jsp/elencoRegioniJson.jsp
</result>
</action>
…
Politecnico di Torino - Tesi di Laurea Specialistica
Pasturenzi Francesco
11
Creazione degli overlay con
Google Maps
Le coordinate delle regioni, province
e comuni per la creazione degli
overlay(poligoni) sono state trovate
in rete in formato KML.
Alcuni di questi file sono stati scoperti
essere incompleti e/o errati perciò è
stata scritta una funzione ad-hoc, per il
reperimento e generazione dei punti
mancanti, allo scattare dell’evento click
sulla mappa (operazione eseguita a
mano).
Politecnico di Torino - Tesi di Laurea Specialistica
Pasturenzi Francesco
12
Creazione degli overlay con
Google Maps
Tabella coordinate e stringone Google
Lato Client:
Lato Server:
Vengono usate le API di Google Maps che si occupano della decodifica delle “stringone”
Viene
fatto un check sull’attributo “stringa_Google”
per l’area
interessata,
se
[google.maps.geometry.encoding.decodePath()]
e della
creazione
dei poligoni
risulta
inesistente(null), viene in
chiamata
una procedura
legge colore
tutte leecoordinate
di al
[google.maps.Polygon()]
cui vengono
impostatiche
opacità,
abilitazione
quella
ne fa una in
cernita
in tra
base
al rispetto
di una distanza minima preeventospecifica
click perarea,
la navigazione
mappa
le diverse
aree.
impostata
e le al
passa
al metodo
della classe
PolylineEncoder
Eventualmente
poligono
creato createEncoding()
viene associato un marker
custom
in cui compare un
che
le elabora,
ne produce
la stringona
poi memorizzata
database e utilizzata lato e
icona
descrittiva
del nome
dell’area
sottostante nel
[google.maps.Marker()
client
per l’overlay dell’area.
google.maps.MarkerImage()].
Politecnico di Torino - Tesi di Laurea Specialistica
Pasturenzi Francesco
13
Conclusioni
Attualmente
l’applicativo è stato acquistato dalla società
Migliorie future:
YouTrend.
attualmente
online ed è di libero
migliorare L’applicativo
il filtraggio a èlivello
di comuni;
accesso.
 di aumentare le performance
I browser supportati sono quelli di ultima generazione.
 si ha intenzione di di più utenti connessi;
JavaScript deve essere attivo. Altrimenti la parte AJAX/JSON e
aggiunta
di non
nuovifunzionano.
grafici per effettuare analisi statistiche più
leAPI
di Google
mirate e precise;
 integrazione di report personalizzabili dall’utente con possibilità
Problemi
riscontrati:
di download
in PDF e Excel;
Durante
lo sviluppo sono
stati riscontrati
 implementazione
di un’area
di accessoproblemi
a crediti;per il
caricamento della Mappa Google durante l’operazione di filtraggio
sviluppo
di unaQuesto
web-app
per tutti
i dispositivi
che (overlays)
supportano
alivello
di comuni.
perchè
il numero
di poligoni
WebKit/ (Android,
e iPad).
da creare
caricare e iPhone
le relative
informazioni di contorno sono
notevoli.
Politecnico di Torino - Tesi di Laurea Specialistica
Pasturenzi Francesco
14
Grazie per
l’Attenzione.
Politecnico di Torino - Tesi di Laurea Specialistica
Pasturenzi Francesco
15