Creazione degli Shape File

La parte finale di questo capitolo sarà focalizzata sull inserimento di tabelle contenenti Shapefile utilizzando il software free QGIS. Sono stati già introdotti i software GIS all’interno del paragrafo riguardante la descrizione degli Shapefile nel primo capitolo. Cercando in rete la parola "GIS Software" compariranno innumerevoli risultati relativi al numero elevato di software disponibili sul mercato.

QGIS è uno dei più famosi GIS, multipiattaforma, disponibili in varie lingue e Open, rappresenta una delle migliori alternative disponibili sul mercato. L’utilizzo di questo strumento in questo progetto è stato volto alla creazione delle seguenti tabelle:

• shape_world: tabella che ha al suo intenrno tutti gli stati del mondo; • shape_regions: tabella avente tutte le regioni dei principali stati europei: Austria, Belgio, Francia, Germania, Gran Bretagna, Irlanda, Italia, Portogallo, Russia, Spagna e Svizzera;

• shape_town: tabella con tutti i comuni italiani;

La creazione di queste tabelle è vincolato all’utilizzo ai fini progettuali. Solo l’ultima è ad uso esclusivo dell’analisi predittiva mentre le altre sono usate per le altre due fasi di analisi.

I file utilizzati ed importati in QGIS sono stati scaricati dal sito GADM38

nella sezione Download. Esso presenta nel suo Set di dati lo Shapefile che racchiude i confini degli stati mondiali in toto, ma allo stesso tempo anche quello dei singoli.

Aprendo QGIS basterà trasportare il file con estensione .shp per poterlo visualizzare. I file tra di loro, sono sovrapponibili e consentono di aggiungere o togliere i layer di interesse.

(a) ShapeFile Stato (b) ShapeFile regioni

(c) ShapeFile provincie (d) ShapeFile comuni

Figura 2.4: Esempi di ShapeFile in QGIS

I file in questione sono pronti per essere caricati. Prima però bisogna connettersi al database:

• Nella parte sinistra di QGIS, in prossimità a PostGIS, selezionare con il tasto destro ‘Nuova Connessione’;

• Immettere un nome e le credenziali definite al momento della creazione del DB;

• Nella ‘Barra dei Menu’, selezionare la voce ‘DB Manager’;

• Selezionare ‘Import Layer accertandosi di aver selezionato il DB cor- retto;

• Dopo aver individuato il file nell’area di lavoro, conferire il nome alla tabella. Lo schema di default è quello public;

• settare le proprietà facendo ben attenzione a checkare sia l’indice spaziale e sia la creazione della colonna geom di tipo Geometry; • Importare la tabella

A questo punto, se tutto è andato per il verso giusto, la nuova tabella do- vrebbe essere visibile nello schema del db.

Quanto descritto ultima la fase di "preparazione dei dati" . Adesso si dispone di tutti gli elementi necessari per poter creare il progetto e conferirgli una struttura.

Implementazione

In questo capitolo, sarà descritta l’implementazione del progetto. Sarà dato spazio per cui, al codice necessario per strutturare la Dashboard fina- le, seguendo la struttura dettata dal mockup visto nel capitolo precedente. Tale descrizione non riguarderà solo la parte front end, ma anche quella bac- kend,cercando di dare una visione esaustiva delle chiamate effettuate e delle query adoperate per presentare i dati su mappa.

3.1

Tecnologie Usate

Le tecnologie adoperate sono state scelte al fine di cercare di ottenere un’esperienza utente e di fruizione che fossero soddisfacenti e in linea con i vincoli definiti nei capitoli precedenti. Le principali esse sono:

• Angular 7 (o più genericamente Angular) è una framework e allo stesso tempo una piattaforma per scrivere applicazioni web e mobi- le. I linguaggi che utilizza sono HTML e Typescript. Quest’ultimo è lo stesso con cui è stato implementato. E’ la naturale Evoluzione di AngularJS1_{. L’evoluzione del linguaggio, ha portato a mantenere i}

costrutti di base ma cambiando le modalità di implementazione (come si vedrà più avanti), portandole ad essere più semplici. Ogni app An- gular ha un modulo root, chiamato convenzionalmente AppModule, che 1_{Data la vasta diffusione, è ancora scaricabile ed utilizzabile in alternativa ad Angular} 7

insieme al file index.html fornisce il boot per l’avvio dell’applicazione. Un’app in genere contiene molti moduli funzionali

– Angular CLI è un interfaccia a riga di comanda ideata per in- stallare e generare le componenti necessarie: componenti, modu- li,ambienti di test etc, oltre che per lanciare il progetto ad ogni avvio. E’ installabile da npm.

– Angular Material: è un’implementazione che segue le linee di progettazione definite in Google Material Design2_{. Fornisce un}

set di componenti di interfaccia integrabili nei progetti Angular. La sua installazione è legata all’utilizzo di Angular CLI.

– ngx-charts3 _{framework pensato per Angular dalla versione 2 in}

avanti per e la creazione di grafici interattivi. Sfrutta la libreria D34

• Node.js5_{: piattaforma Open Source per l’implementazione di opera-}

zioni server-side in Javascript.

• npm: gestore di pacchetti utilizzato di default da Node.js. usato per condividere pacchetti tra le organizzazioni e per gestire lo svilup- po privato. Tra i vari pacchetti utilizzati, i più importanti, in virtù dell’importanza che hanno assunto ai fini del progetto, sono:

– Concurrently: per lanciare multipli comandi in modo concor-

rente. Ai fini progettuali, il suo utilizzo è connotato al riavvio del client e del server ad ogni modifica rilevata.

– Express.js6_{: è un framework scritto in Node.js che consente la}

creazione di un server veloce e flessibile.

– Nodemon7_{: è un utility ideata per monitorare ogni cambiamen-}

to nel codice lato server e automaticamente riavviarlo ad ogni cambiamento. E’ usato in combinazione con concurrently. 2_{https://material.io/archive/guidelines/#}

3_{https://swimlane.github.io/ngx-charts/# /ngx-charts/bar-vertical}

4_{Libreria Javascript per manipolare i documenti partendo dai dati. https://d3js.org/} 5_{https://nodejs.org/en/}

6_{https://www.npmjs.com/package/express} 7_{https://nodemon.io/}

– node-postgres (pg)8 _{è un client PostGres interamente scrit-}

to in Javascript. Grazie ad esso, è possibile eseguire query sul Database.

• R9_{: è un linguaggio e un ambiente (con R Studio) per l’elaborazione}

statistica. Offre un’ampia varietà di tecniche statistiche (modellistica lineare e non lineare, test statistici classici, analisi di serie tempo- rali, classificazione, raggruppamento, etc.) e tecniche grafiche ed è altamente estensibile.

• Leaflet.js 10_{: è la libreria Javascript Leader per mappe interattive e}

ottimizzate sui dispositivi mobile. La sua facilità di utilizzo, insieme alla larga adozione da parte degli sviluppatori ha fatto sì che nel tem- po, fosse integrata con svariati plugin divenuti man mano ufficiali ed elencati sul sito ufficiale. Quelli usati sono:

– leaflet-boundary-canvas: serve per la creazione di mappe statiche a mò di immagine;

– leaflet-easybutton: permette l’inserimento di bottoni

– leaflet-search: permette di cercare i punti o qualsiasi tipo di dato spaziale partendo da un valore di un attributo prestabilito. – leaflet.heat: dà la possibilità di creare mappe di colore, meglio

conosciute come heatmap.

– leaflet.markercluster:consente di clusterizzare i vari punti su map- pa per fornire un rendering e uno scroll dinamico.

– leaflet.slider: slider dinamico integrabile direttamente su mappa. • Turf.js11_{:libreria per l’analisi geospaziale su client. Fornisce molte}

features e dati spaziali e il loro utilizzo è estremamente facile e veloce. 8_{https://www.npmjs.com/package/pg}

9_{https://www.r-project.org/about.html} 10_{https://leafletjs.com/}