Sistemi multimediali Massimiliano Piscozzi – [email protected] IndexedFaceSet (1) • Rappresenta una superficie poligonale composta da facce definite su un insieme di vertici 1 2 0 3 4 0 1 2 3 4 coord ... ... ... ... ... Faccia 0 3 1 Faccia 1 3 2 Faccia 3 4 2 L’ordine (orario/antiorario) con il quale si enumerano i vertici di una faccia determina la direzione della normale (e quindi il lato visibile della faccia) Le facce poligonali possono avere più di 3 vertici IndexedFaceSet (2) IndexedFaceSet : X3DComposedGeometryNode{ MFInt32 [in] set_colorIndex MFInt32 [in] set_coordIndex MFInt32 [in] set_normalIndex MFInt32 [in] set_texCoordIndex SFNode [in,out] color NULL SFNode [in,out] coord NULL SFNode [in,out] normal NULL SFNode [in,out] texCoord NULL MFInt32 [] colorIndex [] MFInt32 [] coordIndex [] MFInt32 [] normalIndex [] MFInt32 [] texCoordIndex [] SFBool [] colorPerVertex TRUE SFBool [] normalPerVertex TRUE SFBool [] ccw TRUE SFBool [] solid TRUE ... } [X3DColorNode] [X3DCoordinateNode] [X3DNormalNode] [X3DTextureCoordinateNode] IndexedFaceSet (3) <IndexedFaceSet coordIndex="0, 1, 2, -1, 2, 1, 3" colorIndex="0, 1, 2, -1, 3, 3, 3"> <Coordinate point="0 0 0, 2 0 0, 0 2 0, 2 2 0"/> <Color color="1 0 0, 0 0 1, 1 1 0, 1 1 1"/> </IndexedFaceSet> • Il valore ‘-1’ nelle liste degli indici funge da delimitatore per gli indici delle singole facce • I valori delle coordinate, dei colori, delle normali e delle coordinate di superficie (texture) sono memorizzate nei nodi: <Coordinate point=“...”/> <Color color=“...”/> <Normal vector=“...” /> <TextureCoordinate point=“...”/> (MFVec3f) (MFColor) (MFVec3f) (MFVec2f) Texturing (1) • L’aspetto di un oggetto può essere definito attraverso una o più immagini (textures) applicate sulla superficie: – Se l’immagine è in una componente (scala di grigi) allora viene utilizzata per modificare l’intensità del colore definito all’interno del nodo Material • Le textures sono applicate alle facce di un oggetto definendo per ogni vertice di ogni faccia delle coordinate di superficie – Per le primitive geometriche (cube, sphere, ...) non è necessario specificare le coordinate di superficie t (0.5, 1) (1, 0.5) 1 (1, 0.5) (0.5, 1) 0 (0.5, 0) 1 s (0.5, 0) Texturing (2) • All’interno di un nodo Appearance è possibile specificare uno dei seguenti nodi: – ImageTexture: – PixelTexture: – MovieTexture: immagine bitmap immagine definita da un nodo SFImage filmato video ImageTexture : X3DTexture2DNode { MFString [in,out] url SFBool [in] repeatS SFBool [in] repeatT ... } PixelTexture : X3DTexture2DNode { SFImage [in,out] image SFBool [in] repeatS SFBool [in] repeatT ... } “” TRUE TRUE 000 TRUE TRUE Texturing (3) MovieTexture : X3DTexture2DNode { MFString [in,out] url SFBool [in,out] loop SFFloat [in,out] speed SFTime [in,out] startTime SFTime [in,out] stopTime SFTime [in,out] pauseTime SFTime [in,out] resumeTime SFBool [] repeatS SFBool [] repeatT SFTime [out] duration_changed SFTime [out] elapsedTime SFBool [out] isActive SFBool [out] isPaused ... } “” TRUE 1.0 0 0 0 0 TRUE TRUE • All’interno del nodo Appearance è possibile specificare anche un nodo TextureTransform TextureTransform : X3DTextureTransform2DNode { SFVec2f [in,out] center 00 SFFloat [in,out] rotation 0 SFVec2f [in,out] scale 11 SFVec2f [in,out] translation 00 ... } Esempio • Creazione di un tetraedro e applicazione di un’immagine distinta per ogni faccia 3 2 1 4 <Shape> <IndexedFaceSet coordIndex="0,2,1, -1, 0,1,3, -1, 1,2,3, -1, 2,0,3" texCoordIndex="1,2,6, -1, 3,5,8, -1, 5,7,9, -1, 0,1,4"> <Coordinate point="-0.5 0 0.289, 0.5 0 0.289, 0 0 -0.577, 0 0.816 0"/> <TextureCoordinate point="0 0, 0.5 0, 1 0, 0 0.5, 0.25 0.5, 0.5 0.5, 0.75 0.5, 1 0.5, 0.25 1, 0.75 1"/> </IndexedFaceSet> <Appearance> <ImageTexture url="textureFaces.jpg"/> </Appearance> </Shape> Billboard • Il nodo Billboard definisce un sistema di coordinate locali tale che l’asse Z sia indirizzato sempre verso il “punto di vista” • Utile per approssimare degli elementi grafici tridimensionali attraverso semplici pannelli bidimensionali con applicate delle texture Billboard : X3DGroupingNode { MFNode [in] addChildren MFNode [in] removeChildren SFVec3f [in,out] axisOfRotation MFNode [in,out] children ... } [X3DChildNode] [X3DChildNode] 010 [] [X3DChildNode] Esempio • Creazione di un gruppo di alberi: ogni albero è rappresentato attraverso una texture applicata su un pannello bidimensionale <Transform translation= "…"> <Billboard DEF="Albero" axisOfRotation="0 1 0"> <Shape> <IndexedFaceSet coordIndex="0,1,2,3" texCoordIndex="0,1,2,3"> <Coordinate point="-1,0,0, 1,0,0, 1,4,0, -1,4,0"/> <TextureCoordinate point="0,0, 1,0, 1,1, 0,1"/> </IndexedFaceSet> <Appearance> <ImageTexture url="tree.png"/> </Appearance> </Shape> </Billboard> </Transform> <Transform translation= "…"> <Billboard USE=“Albero”/> </Transform> Sound (1) • Il nodo Sound permette di creare delle sorgenti acustiche nello spazio 3D Sound : X3DSoundNode SFVec3f [in,out] SFVec3f [in,out] SFFloat [in,out] SFFloat [in,out] SFFloat [in,out] SFFloat [in,out] SFFloat [in,out] SFNode [in,out] SFBool [] ... } { location direction intensity minFront minBack maxFront maxBack source spatialize 000 001 1.0 0 0 0 0 NULL TRUE [X3DSoundSourceNode] • Modello acustico minFront maxFront location direction maxBack minBack Sound (2) • File audio (.wav, .midi, .mp3) AudioClip : X3DSoundSourceNode { SFBool [in,out] loop SFFloat [in,out] pitch SFTime [in,out] startTime SFTime [in,out] stopTime SFTime [in,out] pauseTime SFTime [in,out] resumeTime MFString [in,out] url SFTime [out] duration_changed SFTime [out] elapsedTime SFBool [out] isActive SFBool [out] isPaused ... } TRUE 1 0 0 0 0 “” I campi loop, startTime e stopTime permettono di attivare l’Audioclip allo stesso modo di quanto avviene per il TimeSensor La variazione del pitch modifica sia il tono sia la velocità di riproduzione • Esempio <Sound minBack="6" minFront="6" maxBack="11" maxFront="11"> <AudioClip description="LittleBirds" loop="true" url="Littlebirds.mid"/> </Sound> Text • Il nodo Text permette di creare del testo bidimensionale nello spazio 3D: – È un nodo del tipo X3DGeometryNode quindi va utilizzato all’interno di un nodo Shape Text : X3DGeometryNode { SFNode [in,out] fontStyle MFString [in,out] string MFFloat [in,out] length SFFloat [in,out] maxExtent SFBool [in.out] solid ... } NULL [X3DFontStyleNode] [] [] 0.0 FALSE E’ possibile specificare più stringhe di caratteri; ognuna di esse sarà visualizzata su una riga differente I valori memorizzati in length specificano la lunghezza di ogni stringa; essi non sono obbligatori, ma permettono di allungare o comprimere arbitrariamente le stringhe di caratteri FontStyle • Il nodo FontStyle permette di specificare le proprietà di formattazione del testo specificato nel nodo Text FontStyle : X3DFontStyleNode { SFString [in,out] style SFString [in,out] justify SFBool [in,out] horizontal SFBool [in,out] leftToRight SFBool [in,out] topToBottom SFFloat [in,out] size SFFloat [in,out] spacing ... } “PLAIN” “BEGIN” TRUE TRUE TRUE 1.0 1.0 [“PLAIN” | “BOLD” | “ITALIC” | “BOLDITALIC”] [“BEGIN” | “END” | “FIRST” | “MIDDLE”] • Esempio <Shape> <Text string='"Hello" "X3D-World!"' length="5 5"> <FontStyle style="BOLDITALIC"/> </Text> <Appearance …/> </Shape> <Shape> <Text string='"Hello" "X3D-World!"'> <FontStyle horizontal="false" /> </Text> <Appearance …/> </Shape> Background • Il background della scena virtuale può essere definito attraverso una serie di colori (ground e sky) oppure attraverso sei immagini (front, back, left, right, top, bottom) • Il nodo Backround è un nodo di tipo bindable: solo un’istanza alla volta può essere attiva. Background : X3DBackgroundNode { SFBool [in] set_bind SFTime [out] bind_time SFBool [out] isBound MFColor [in,out] groundColor MFColor [in,out] skyColor MFFloat [in,out] groundAngle MFFloat [in,out] skyAngle MFString [in.out] backUrl MFString [in.out] bottomUrl MFString [in.out] frontUrl MFString [in.out] leftUrl MFString [in.out] rightUrl MFString [in.out] topUrl ... } [] [] [] [] “” “” “” “” “” “” E’ possibile specificare più colori per il cielo e la terra. Essi vanno associati ad un determinato angolo (zenith = 0, orizzonte=pi/2, nadir=pi) Scene di grandi dimensioni • La gestione di scene di grandi dimensioni può essere agevolata utilizzando prototipi definiti esternamente oppure attraverso i nodi inline • Un nodo inline permette di inserire all’interno della scena corrente i nodi di una scena X3D definita esternamente <Inline url=“…”/> I nodi importati attraverso inline non sono “visibili” agli altri nodi della scena ed è quindi impossibile stabilire con essi delle connessioni per il routing degli eventi X3D in pagine HTML • L’inserimento di una scena X3D in una pagina HTML avviene attraverso il tag HTML “EMBED” <EMBED src=“…” width=“…” height=“…”> • Esempio <html> <head> <title> X3D in una pagina HTML </title> </head> <body bgcolor="white"> <center> <h1> Integrazione di "MyScene.x3d" in una pagina "html“ </h1> <EMBED src="MyScene.x3d" width=“700" height="450"> </center> </body> </html> X3D-Edit • Installazione di X3D-Edit (PC Windows) – Installare Java sul PC • “Java FRE – Java Run-Time Environment” • oppure “Java SDK – Java Software Development Kit” – Installare l’editor XML Xeena di IBM (www.alphaworks.ibm.com/tech/xeena) • Lasciare il path di installazione predefinito (“C:\”) – Installare la versione di X3D-Edit senza VirtualMachine (www.web3d.org/x3d/content/X3D-EditAutoInstall/Web_Installers/install.htm) • Lasciare il path di installazione predefinito – Creare una variabile d’ambiente (“Pannello di Controllo””Sistema””Avanzate””Variabili d’ambiente”) • Nome variabile: JAVA_HOME • Valore variabile: il path di installazione di Java (la cartella contenente al suo interno la cartella bin)