lod v iz progetto di semestre omar davide molteni stefano mondini v isualizzatore di o pen d ata
TRANSCRIPT
![Page 1: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/1.jpg)
LOD VIZ
Progetto di semestreOmar Davide Molteni
Stefano Mondini
VISUALIZZATORE DI OPEN DATA
![Page 2: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/2.jpg)
2
INTRODUZIONE
![Page 3: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/3.jpg)
3
COS'È LOD VIZ? Visualizzatore grafico di open data per
il Laboratorio Sistemi Semantici e Multimediali (DTI-ISIN-LSMS)
Costruito con moderni standard web (HTML5, CSS3)
Core in JavaScript Caricamento dinamico dei dati JSON
![Page 4: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/4.jpg)
4
COMPITI E OBIETTIVIAcquisire competenze sul
semantic webStudio di nuove tecnologie web
HTML5, JavaScript, CSS3Studio stato dell’arte
![Page 5: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/5.jpg)
5
TECNOLOGIE UTILIZZATEJSONHTML 5CSS 3JavaScriptjQueryMustacheTwitter Bootstrap
![Page 6: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/6.jpg)
6
STUDIO DELLE SOLUZIONI
![Page 7: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/7.jpg)
7
STATO DELL’ARTEProgetti di diploma precedenti
EasyOnto, di Alessandro Ruggeri (A.A. 2008/09)
Brick, di Nicholas Urech (A.A. 2010/11)
Librerie graficheD3.jsRaphaël
![Page 8: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/8.jpg)
8
RISK MANAGEMENTRitardo nelle consegneRaggiungimento degli obiettiviPerdita o danneggiamento dei
datiProblemi organizzativi o di
comunicazione
![Page 9: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/9.jpg)
9
DESIGN E CONCEZIONE
![Page 10: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/10.jpg)
10
FUNZIONAMENTO
![Page 11: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/11.jpg)
11
INTERFACCIA GRAFICA Blocco centrale per le informazioni
dell’elemento scelto Blocchi periferici contenenti le risorse
Divise per tipoCollegate con frecce direzionali al blocco
centrale
![Page 12: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/12.jpg)
12
EVOLUZIONE DELL’ INTERFACCIA
PrimaDopo
![Page 13: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/13.jpg)
13
REALIZZAZIONE E TEST
![Page 14: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/14.jpg)
14
ARCHITETTURAVisualizzazione
HTML (template, documentazione)Fogli di stile (CSS)
Lettura ed elaborazione datiFormattazione dei dati e
posizionamento degli oggetti
![Page 15: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/15.jpg)
15
ARCHITETTURA (HTML)<div id='loader' class='hideCover'>
<img src='css/loader.gif'></div>
<div id="base">…</div>
![Page 16: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/16.jpg)
16
ARCHITETTURA (CSS).circleinside {position: absolute;…
}.circleinside:hover{ … }
.circleinside.out{… }
.circleinside.out:hover{… }
![Page 17: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/17.jpg)
17
ARCHITETTURA (CSS)#centrale {background: #EEEEEE;background: #EEEEEE -moz-linear-gradient(-45deg, #EEEEEE, #AAAAAA);
box-shadow: 2px 2px 2px 2px #666;…max-width: 360px;z-index: 100;
}
![Page 18: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/18.jpg)
18
ARCHITETTURA (JS)$(function () {"use strict";
var Core = {…start:function(args) {
…
Core.start({base:'#base', loader:'#loader'});
![Page 19: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/19.jpg)
19
ARCHITETTURA (JS)$.when(loadOutDataFunc).always(function (outData) {$.when(loadInDataFunc).always(function (inData) {
var outResolved = loadOutDataFunc.isResolved();
var inResolved = loadInDataFunc.isResolved();
…
![Page 20: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/20.jpg)
20
ARCHITETTURA (JS)var ctx = this.node.getContext('2d');
ctx.beginPath();…ctx.moveTo(zerox, height - zeroy);ctx.lineTo(width - zerox, zeroy);…ctx.closePath();ctx.stroke();
![Page 21: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/21.jpg)
21
TEST E COMPATIBILITÀFirebug per il debug e controllo
dei messaggi di avviso/errore
![Page 22: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/22.jpg)
22
TEST E COMPATIBILITÀVerifica tramite più browser
FirefoxChromeSafariIE 9Opera
Sistemi operativiWindows 7, OS X Lion 10.7
Problema cross-domain AJAX
![Page 23: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/23.jpg)
23
COMPATIBILITÀFirefox
![Page 24: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/24.jpg)
24
COMPATIBILITÀChrome (18) sotto Windows 7
![Page 25: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/25.jpg)
25
COMPATIBILITÀInternet Explorer 9
![Page 26: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/26.jpg)
26
DEMO
![Page 27: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/27.jpg)
27
DEMO
![Page 28: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/28.jpg)
28
CONCLUSIONI
![Page 29: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/29.jpg)
29
CONCLUSIONIObiettivi raggiuntiStudio e analisi con elementi di
ingegneria software 3Problemi riscontrati
Tempo studio linguaggio impegnativoSviluppi futuri
Indipendenza dati progetto BrickMiglioramento compatibilità browserMaggiore modularità
![Page 30: LOD V IZ Progetto di semestre Omar Davide Molteni Stefano Mondini V ISUALIZZATORE DI O PEN D ATA](https://reader037.vdocuments.site/reader037/viewer/2022110305/5542eb64497959361e8cd9ef/html5/thumbnails/30.jpg)
30
DOMANDE