GIS on the WEB: un esempio di grafica vettoriale 3D Bianca Falcidieno Flavio Rossi Michela Spagnuolo...

GIS on the WEB:un esempio di grafica vettoriale

3D

GIS on the WEB:un esempio di grafica vettoriale

3D

Bianca FalcidienoFlavio Rossi

Michela Spagnuolo

Bianca FalcidienoFlavio Rossi

Michela Spagnuolo

Istituto per la Matematica ApplicataConsiglio Nazionale della Ricerche

GENOVA

Istituto per la Matematica ApplicataConsiglio Nazionale della Ricerche

GENOVA

Computer GraphicsComputer Graphics

Industrial AutomationIndustrial Automation ErgonomyErgonomy

Geographic InformationSystems

Geographic InformationSystems

ElectromagneticsElectromagnetics

Educational ComputingEducational ComputingTele-TeachingTele-TeachingMulti-Media SystemsMulti-Media Systems

HighPerformanceComputing

HighPerformanceComputing

Istituto per la Matematica ApplicataIstituto per la Matematica Applicata

CONSIGLIO NAZIONALE DELLE RICERCHECONSIGLIO NAZIONALE DELLE RICERCHE

Bianca Falcidieno - Flavio Rossi - Michela Bianca Falcidieno - Flavio Rossi - Michela SpagnuoloSpagnuolo 33

• Standard Internazionale ISO/IEC 14772 :Standard Internazionale ISO/IEC 14772 :– Information technology Information technology Computer graphics and image Computer graphics and image

processing processing The Virtual Reality Modeling languageThe Virtual Reality Modeling language

• Nasce nel 1994 da Mark Pesce e Tony ParisiNasce nel 1994 da Mark Pesce e Tony Parisi– basato su tecnologia Open Inventor (OpenGL) della SGI.basato su tecnologia Open Inventor (OpenGL) della SGI.

• Formato di file progettato per supportare: Formato di file progettato per supportare: – geometria della scenageometria della scena– comportamenti multimediali degli oggetti contenuti in essacomportamenti multimediali degli oggetti contenuti in essa– interazione dell’utente con la scenainterazione dell’utente con la scena

• Ancora in via di sviluppo: da VRML 1.0 a VRML 2.0Ancora in via di sviluppo: da VRML 1.0 a VRML 2.0

VRML: Virtual Reality Modeling LanguageVRML: Virtual Reality Modeling Language


• Linguaggio interpretato ed Object OrientedLinguaggio interpretato ed Object Oriented– il mondo virtuale è schematizzato attraverso un grafoil mondo virtuale è schematizzato attraverso un grafo– i nodi corrispondono ai singoli oggetti nella scenai nodi corrispondono ai singoli oggetti nella scena

• Tipo di file utilizzato: ASCIITipo di file utilizzato: ASCII– si presta come formato di scambiosi presta come formato di scambio– i maggiori software CAD importano ed esportano in VRMLi maggiori software CAD importano ed esportano in VRML

• È la descrizione di un mondo virtuale e di come È la descrizione di un mondo virtuale e di come viene gestita l’interazione mondoviene gestita l’interazione mondoutente. Il file utente. Il file descrive:descrive:– gli oggetti contenutigli oggetti contenuti– la loro posizione, il loro orientamento e il loro colorela loro posizione, il loro orientamento e il loro colore– l’ambientazione della scenal’ambientazione della scena

VRML: concetti principaliVRML: concetti principali


VRML: composizione del fileVRML: composizione del file

• Un file VRML contiene:Un file VRML contiene:– un un HeaderHeader obbligatorio: obbligatorio: #VRML V2.0 utf8#VRML V2.0 utf8– NodiNodi:: elementi descrittivi della scena: elementi descrittivi della scena:

• shapeshape• interpolatoriinterpolatori• sensorisensori• scriptscript• ecc. ecc.

– FieldsFields:: attributi descrittivi dei nodi attributi descrittivi dei nodi– PrototipiPrototipi:: definizione di nuovi nodi definizione di nuovi nodi– RoutesRoutes:: percorsi degli eventi tra i nodi percorsi degli eventi tra i nodi– Definizioni di nomiDefinizioni di nomi per i nodi e loro riutilizzo per i nodi e loro riutilizzo– CommentiCommenti


• I nodi contengono:I nodi contengono:– il tipo di nodo (con eventuale nome)il tipo di nodo (con eventuale nome)– un insieme di parentesiun insieme di parentesi– un certo numero di campi descrittivi del nodoun certo numero di campi descrittivi del nodo

• I campi relativi ai nodi sono formati da:I campi relativi ai nodi sono formati da:– il tipo di campo (il tipo di campo (single-valuesingle-value o o multi-valuemulti-value))– il nome del campoil nome del campo– il valore associato al campo utile a definire il valore associato al campo utile a definire

l’attributo del nodol’attributo del nodo

VRML: sintassi nodi / campiVRML: sintassi nodi / campi

Single Value Type Multi Value Type

SFNode MFColor

SFFloat MFString

SFVec3f MFVec3f

SFInt32 MFRotation

Single Value Type Multi Value Type

SFNode MFColor

SFFloat MFString

SFVec3f MFVec3f

SFInt32 MFRotation

DEF asse Cylinder { height 5.0 radius 2.0}

SFVec3f center 0 0 0


VRML: esempio di scena 3DVRML: esempio di scena 3D#VRML V2.0 utf8Group { children [ Shape { appearance DEF Pink Appearance { material Material { diffuseColor 0.6 0.6 0.0 } } geometry Cylinder { height 2.0 radius 2.0 } } # end Shape Transform { translation 0.0 2.0 0.0 children Shape { appearance USE Pink geometry Cone { height 2.0 bottomRadius 2.5 } } } # end Transform ] # end children} # end Group

sorgentsorgentee

Group

Shape Transform

DEF BrownAppearance

CylinderShape

ConeMaterialGrafoGrafo

ScenaScena3D3D


VRML: animazioni - java - javascript VRML: animazioni - java - javascript

• Il VRML gestisce comportamenti interattivi:Il VRML gestisce comportamenti interattivi:– ciascun oggetto nella scena può generare/ricevere eventi:ciascun oggetto nella scena può generare/ricevere eventi:

• campo campo eventIneventIn per ricevere eventi per ricevere eventi• campo campo eventOuteventOut per generare eventi per generare eventi• campo campo exposedFieldexposedField per generare/ricevere eventi per generare/ricevere eventi

– il comando ROUTE crea un circuito fra gli oggetti:il comando ROUTE crea un circuito fra gli oggetti:• ROUTEROUTE nome-nodo1.eventOutnome-nodo1.eventOut TOTO nome-nodo2.eventInnome-nodo2.eventIn

Script { url "myscript.js" field ... eventIn ... eventOut … }

• Il VRML offre la possibilità di interagire con altri Il VRML offre la possibilità di interagire con altri linguaggi di programmazione:linguaggi di programmazione:– Java e JavaScript per costruzione algoritmi Java e JavaScript per costruzione algoritmi

complessicomplessi– integrazione nella scena VRML attraverso:integrazione nella scena VRML attraverso:

• nodo scriptnodo script• comando ROUTEcomando ROUTE


VRML: creazione di nuovi nodiVRML: creazione di nuovi nodi

• È possibile creare nuovi nodi con il nodo:È possibile creare nuovi nodi con il nodo:– PROTO / EXTERNPROTO così composto:PROTO / EXTERNPROTO così composto:

• un un nomenome per il nodo per il nodo• lista di lista di fieldsfields, , eventIneventIn, , eventOuteventOut per descrivere l’interfaccia per descrivere l’interfaccia

del nododel nodo• un un corpocorpo che descrive il nodo che descrive il nodo

#VRML V2.0 utf8PROTO MyCube [field SFVec3f position 0 0 0 field SFColor color 1 1 1 field SFVec3f size 1 1 1]{ Transform { translation IS position children Shape { geometry Box {size IS size} appearance Appearance { material Material{diffuseColor IS color}}}}}MyCube {color 1 0 0 position 0 0 0 size 2 2 2}MyCube {color 0 1 0 position 3 0 0 size 2 3 1}MyCube {color 1 1 0 position 0 -4 1 size 3 2 4}MyCube {color 0 0 1 position 0 2 0 size 1 1 1}MyCube {color 0 1 1 position -5 1 0 size 1 2 1}


““a Data Management and Data Visualisation System for Supporting a Data Management and Data Visualisation System for Supporting Coastal Zone Management of the Mediterranean Sea”Coastal Zone Management of the Mediterranean Sea”

• ScopoScopo– Sistema aperto ed integrato per la modellazione, Sistema aperto ed integrato per la modellazione,

visualizzazione ed analisi di dati ambientali, fruibile via visualizzazione ed analisi di dati ambientali, fruibile via InternetInternet

• ObiettiviObiettivi– Accesso On-line secondo la tecnologia WWWAccesso On-line secondo la tecnologia WWW– Visualizzazione immediata di modelli (plugin) e datiVisualizzazione immediata di modelli (plugin) e dati – Ricerca efficiente di dati e modelli via MetadataRicerca efficiente di dati e modelli via Metadata– Integrazione flessibile dei dati utente: pubblicazioneIntegrazione flessibile dei dati utente: pubblicazione– Visualizzazione ed interazione dei modelli utilizzando Visualizzazione ed interazione dei modelli utilizzando

tecnologie GIS e la Virtual Realitytecnologie GIS e la Virtual Reality

•ICS-FORTHICS-FORTH

•University of CreteUniversity of Crete

•IMBCIMBC •INRIAINRIA

•Space AlcatelSpace Alcatel

•RECORMED-NETWORKRECORMED-NETWORK

•ERCIMERCIM

•HR WALLINGFORDHR WALLINGFORD

•IMA-CNRIMA-CNR

THETIS: Telematics on ResearchTHETIS: Telematics on Research


THETIS: architettura del sistemaTHETIS: architettura del sistema

retrievalretrievalengineengine

SearchSearchengineengine

WrapperWrapperss

per dati eper dati eprogrammprogramm

ii

datiprogrammi

programmi

dati

datiInterfaccia WWWInterfaccia WWW

Server #1Server #1

Server #2Server #2

Server #nServer #n

LeSelectLeSelect

accesso

datipubblicati


THETIS: Data/Program WrapperTHETIS: Data/Program Wrapper

• Interfaccia a dati/programmi scritti in Interfaccia a dati/programmi scritti in XMLXML– composto da composto da elementielementi delimitati da delimitati da tagstags– un elemento contiene un elemento contiene attributiattributi definiti nel tag di apertura definiti nel tag di apertura

• Data wrapperData wrapper per l’accesso ai dati per l’accesso ai dati

• Program wrapperProgram wrapper per l’esecuzione dei programmi per l’esecuzione dei programmi

<Wrapper WrapperClass="PointsWrapper.PointsWrapperFactory" ><Parameters>

<Table name="liguria" file=".../liguria.inp"><Column name="x" type="DOUBLE" /><Column name="y" type="DOUBLE" /><Column name="z" type="DOUBLE" />

</Table></Parameters>

</Wrapper>

<ProgramWrapper WrapperClass="DTinWrapper.DTinWrapperFactory"><Parameters

executable=”.../LeSelect/Thetis/TinProc/DTIN"/>

</ProgramWrapper>


THETIS: scenari dimostrativiTHETIS: scenari dimostrativi

• Simulazione di trasporto di inquinanti da sorgente puntiformeSimulazione di trasporto di inquinanti da sorgente puntiforme• Monitoraggio di strutture oceanografiche dinamiche (vortici)Monitoraggio di strutture oceanografiche dinamiche (vortici)• Previsione del moto ondoso e ventoso sotto costa, analisi Previsione del moto ondoso e ventoso sotto costa, analisi

spettrale del moto ondosospettrale del moto ondoso

• Costruzione del Costruzione del Modello Digitale del FondaleModello Digitale del Fondale con possibilità di salvare la triangolazione in con possibilità di salvare la triangolazione in due file di testo:due file di testo:

– File dei verticiFile dei vertici– File della topologiaFile della topologia

• Generazione della scena virtuale in Generazione della scena virtuale in VRML 2.0VRML 2.0

Virtual Navigation of Coastal Virtual Navigation of Coastal AreasAreas


THETIS: Homepage del progettoTHETIS: Homepage del progetto

http://kos.ics.forth.gr:8000/http://kos.ics.forth.gr:8000/

DescrizionDescrizione generale e generale del del progettoprogetto

Partners,Partners,Pubblicazioni,Pubblicazioni,PresentazioniPresentazionie Deliverablese Deliverables

Motore di Motore di ricercaricerca


THETIS: Homepage VINCATHETIS: Homepage VINCA

http://kos.ics.forth.gr:8000/http://kos.ics.forth.gr:8000/

Informazioni esteseInformazioni estesesull’applicazionesull’applicazione

Attivazione delAttivazione delmotore di ricercamotore di ricercaper cercare i datasetper cercare i datasetpubblicatipubblicati in THETIS in THETISutilizzabiliutilizzabilidall’applicazione VINCAdall’applicazione VINCA

Attivazione delAttivazione delprogram wrapperprogram wrapperper l’utilizzoper l’utilizzodel datasetdel datasetattraverso ilattraverso ildata wrapperdata wrapper


THETIS: il modello VRMLTHETIS: il modello VRML

Modello del fondale della LiguriaModello del fondale della Liguria


VRML: modelli digitali di terrenoVRML: modelli digitali di terreno

• Nodo IndexedFaceSetNodo IndexedFaceSet– geometriageometria– shading dei colorishading dei colori– smoothing della superfcie (crease angle)smoothing della superfcie (crease angle)

geometry IndexedFaceSet { colorPerVertex TRUE solid FALSE creaseAngle .785 coord Coordinate { point [ x1 y1 z1, x2 y2 z2, .. .. .. xn yn zn ]}

color Color { color [ r1 g1 b1, r2 g2 b2, .. .. .. rn gn bn ] }

coordIndex [ v11, v12, v13, -1, v21, v22, v23, -1, ... ... ... vm1, vm2, vm3, -1]}

AA BB CC DD

NA NBNC ND

CreaseAngle

Smooth effect Faceted effect


VRML: interazioni con il modelloVRML: interazioni con il modello

• Grazie all’utilizzo di JAVA e JAVASCRIPT è stato Grazie all’utilizzo di JAVA e JAVASCRIPT è stato possibile realizzare particolari eventi di possibile realizzare particolari eventi di interesse geografico.interesse geografico.– Pick PointPick Point sul modello sul modello– ScalingScaling lungo l’asse Z lungo l’asse Z

ScalingScaling-1600

-400

-1000

-700

-1300

487240 4901490 -937

Pick PointPick Point


VRML: processo degli eventiVRML: processo degli eventi• Il seguente modello rappresenta la sequenza Il seguente modello rappresenta la sequenza

logica degli eventi tra i nodi della scenalogica degli eventi tra i nodi della scena

TouchTouchsensorsensor

MouseMouseclickclick

JavaJavascriptscript

Z=Z+1Z=Z+1

TransTransformform

Scale ZScale Z modellomodello

ScaleScale

ChildrenChildren

LegendaLegenda


MouseMousedragdrag


(x,y,z)(x,y,z)

TextText

StringString

StringString“x,y,z”“x,y,z”


MouseMouseclickclick


HoldHoldpointpoint

TextText

StringString

StringString“x,y,z”“x,y,z”

evento

ModellModelloo


Grafica su WEBGrafica su WEB

• Grafica vettoriale 2D:Grafica vettoriale 2D:– integrazione della grafica vettoriale 2D con XMLintegrazione della grafica vettoriale 2D con XML– sviluppo di uno standard per la grafica vettoriale:sviluppo di uno standard per la grafica vettoriale:

• SCALABLE VECTOR GRAPHICS (SVG)SCALABLE VECTOR GRAPHICS (SVG)

• Grafica vettoriale 3D:Grafica vettoriale 3D:

– www.w3.org/Graphics/Activitywww.w3.org/Graphics/Activity

– www.web3d.orgwww.web3d.org


Working groupsWorking groups

Extensible 3DExtensible 3D

The X3D Task Group is designing and The X3D Task Group is designing and implementing the next-generation implementing the next-generation Extensible Extensible 3D (X3D)3D (X3D) Graphics specification. Graphics specification.We are expressing theWe are expressing the geometry and behavior geometry and behavior capabilities of the capabilities of the Virtual Reality Modeling Virtual Reality Modeling LanguageLanguage ( (VRML 97VRML 97) using the ) using the Extensible Extensible Markup LanguageMarkup Language ( (XMLXML).).

http://www.web3d.org/x3d.htmlhttp://www.web3d.org/x3d.html

Enterprise Enterprise TechnologyTechnology

The group's current goals are to deliver The group's current goals are to deliver specifications for the integration of specifications for the integration of XMLXML and and CORBACORBA technology into technology into VRMLVRML

http://www.web3d.org/WorkingGroups/dbwork/http://www.web3d.org/WorkingGroups/dbwork/


Progetto “metadata”Progetto “metadata”

#VRML V2.0 utf8PROTO Metadata [ field MFString url [] eventIn MFString set_url eventOut MFString url_changed eventIn MFString elementID eventOut MFString elementIDs eventOut SFString tagName eventOut MFString attributeNames eventOut MFString attributeValues eventOut MFString childElements eventOut MFString childElementTypes eventOut MFString childElementTags eventOut MFString childElementContents ] { Script {url "metadata.class"}}

definizione del nodo Metadatadefinizione del nodo Metadata

<?xml version="1.0"?><allbooks ID="libro1"><book ID="vrml20" author="myself="1997">Manuale di VRML</book> </allbooks> File XMLFile XML

#VRML V2.0 utf8EXTERNPROTO Metadata [....] "metadata.wrl"DEF books Metadata { url [ "books.xml" ]}DEF S1 Script { eventOut SFString bookID url "javascript: function initialize() { bookID = ’vrml20';}"}Shape { geometry DEF libro Text { string [""] fontStyle DEF Font FontStyle { size 2 justify "MIDDLE" style "BOLD"}}}ROUTE S1.bookID TO books.elementIDROUTE books.attributeNames TO libro.set_string

File VRMLFile VRML

Contact the author at:Contact the author at:[email protected]@us.oracle.com


ima-CNR www.ima.ge.cnr.itima-CNR www.ima.ge.cnr.it

• Contact persons at IMA:Contact persons at IMA:– Bianca FalcidienoBianca Falcidieno

• [email protected]@ima.ge.cnr.it

– Flavio RossiFlavio Rossi• [email protected]@ima.ge.cnr.it

– Michela SpagnuoloMichela Spagnuolo• [email protected]@ima.ge.cnr.it

• THETIS Project:THETIS Project:– http://kos.ics.forth.gr:8000/http://kos.ics.forth.gr:8000/

• The VRML RepositoryThe VRML Repository– http://www.web3d.org/vrml/vrml.htmhttp://www.web3d.org/vrml/vrml.htm

GIS on the WEB: un esempio di grafica vettoriale 3D Bianca Falcidieno Flavio Rossi Michela Spagnuolo...

Documents

Transcript of GIS on the WEB: un esempio di grafica vettoriale 3D Bianca Falcidieno Flavio Rossi Michela Spagnuolo...