Ji ra david sedl ek
This presentation is the property of its rightful owner.
Sponsored Links
1 / 35

Jiří Žára & David Sedláček PowerPoint PPT Presentation


  • 80 Views
  • Uploaded on
  • Presentation posted in: General

Jiří Žára & David Sedláček. Contents. Web3D Consortium and X3D specification GeoVRML , NurbsVRML X3Dom VRML to X3Dom. 2. Web3D Consortium. About 15 Working Groups ( www.web3d.org ) : source : reference browser (Xj3D) h-anim : humanoid animation (done: ISO standard)

Download Presentation

Jiří Žára & David Sedláček

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript


Ji ra david sedl ek

Jiří Žára& David Sedláček


Contents

Contents

  • Web3D Consortium and X3D specification

  • GeoVRML, NurbsVRML

  • X3Dom

  • VRML to X3Dom

2


Web3d consortium

Web3D Consortium

About 15 Working Groups (www.web3d.org):

source: reference browser (Xj3D)

h-anim: humanoid animation (done: ISO standard)

web3d-mpeg: integration with MPEG

dis: distributed interactive simulation

GeoVRML, NurbsVRML (done)

vrml-streams: streaming scene graph & data

media: universal media (like fonts in op. systems)


X3d next vrml version

X3D = Next VRML version

The next generationOpen Web3D standard

Concerted action by keyVRML browser companies(blaxxun, ParallelGraphics,Nexternet, OpenWorlds)

Full compatibility with VRML97

Influence to other standards (MPEG-4, XML)


Architecture

Architecture

Components:Rendering, Geometry, GeoVRML, Language, Texture, Navigation, Nurbs, Scripting, Sensor, etc.

Profiles (subset of components + limitations):Core – light renderers (Java applets)Base – full functionalityInteractive, Immersive, …


Profiles

Profiles


Features

Features

XML notation

Interfaces to scripting languages

Consortium registers new components (OpenGL strategy)

Open source reference browser implementation


Sample code

Sample code

<?xml version="1.0" encoding="UTF-8"?>

<X3D profile='Interactive'>

<Scene>

<Transform DEF=“myObject1" translation=“0 -7 0.5“scale="2 2 2">

<Shape>

<Appearance>

<Material DEF="MAT1" ambientIntensity="1.0“ shininess="0.2“

diffuseColor="0 0.5 0" specularColor="0 0.2 0.0"/>

</Appearance>

<IndexedFaceSet

</IndexedFaceSet>

</Shape>

</Transform>

</Scene>

</X3D>


Specification

Specification

Abstract specificationobject oriented

Three notations- UTF-8 (like VRML97)- XML- Binary (like MPEG-4)

Scene authoring interfaceJava, ECMAScript, DOM


Ji ra david sedl ek

X3D

  • GeoVRML

  • NurbsVRML

Test it !

Test it !

Test it !


X3dom motivation

X3Dom - motivation

Websites (have) become Web applications

  • Increasing interest in 3D for

    • Product presentation

    • Visualization of abstract information

    • Enriching experience of cultural Heritage

  • Plugins for VRML/X3D are a nuisance

    • Problems with permissions, installation, security

  • The same application for different OS

    • PC &mobile devices (Symbian, Android, iOS)

Inspired by X3Dom talk at Fraunhofer IGD (Sep. 2012), texts and images are adapted from the talk also


X3dom

X3Dom

X3Dom – Declarative (X)3D in HTML5

Inspired by X3Dom talk at Fraunhofer IGD (Sep. 2012), texts and images are adapted from the talk also


X3dom1

X3Dom

X3Dom – pronounce X-Freedom

  • Developped at Fraunhofer IGD

    • first stable version 1.0 – 25.3.2010

    • current stable version 1.5.1 – 23.10.2013

  • WebGL / Flash rendering

Inspired by X3Dom talk at Fraunhofer IGD (Sep. 2012), texts and images are adapted from the talk also


Web opengl

WEB - OpenGL

OpenGL and GLSL in the Web: WebGL

  • JavaScript Binding for OpenGL ES 2.0 in Web Browser

    • Firefox, Chrome, Safari, Opera, Internet Explorer 11

  • HTML5 <canvas> element provides 3D rendering context

    • gl=canvas.getContext(‘webgl’);

  • API calls via GL object

    • X3D via X3DOM framework

    • http://www.x3dom.org

Inspired by X3Dom talk at Fraunhofer IGD (Sep. 2012), texts and images are adapted from the talk also


Why x3dom not webgl

whyX3Dom not WebGL ?

  • Simple scene creation

    • Built-in Navigation and Animation

    • Simple scene manipulation (DOM and jQuery)

  • Instant behaviour

    • Automatically split indexes if larger than 65k (webGL limit) – (huge mesh support)

    • Non PowerOfTwo textures

Inspired by X3Dom talk at Fraunhofer IGD (Sep. 2012), texts and images are adapted from the talk also


X3dom 1 st example

X3Dom – 1st example

<html>

<head>

<linkrel=“stylesheet” type=“text/css” href=“x3dom.css”>

<script type=“text/javascript” src=“x3dom.js”></script>

</head>

<body>

<p>3D view:</p>

<x3dwidth=“400” height=“300”>

<scene></scene>

</x3d>

</body>

</html>

Test it !

http://www.x3dom.org/x3dom/release/x3dom.css, http://www.x3dom.org/x3dom/release/x3dom.js

Inspired by X3Dom talk at Fraunhofer IGD (Sep. 2012), texts and images are adapted from the talk also


X3dom 2 nd example

X3Dom – 2nd example

<x3d width=“400” height=“300”>

<scene>

<shape>

<box></box>

<appearance>

<material diffuseColor=“red”>

</material>

<appearance>

</shape>

</scene>

</x3d>

  • All 3D objects are children of the <scene>element

  • Every object has a <shape>

  • …and a geometry, like e.g. a <box>

Test it !

  • …and an <appearance> with material or texture

Test it !

#VRML V2.0 utf8

Shape {

geometry Box {}

appearance Appearance {

material Material {

diffuseColor1 0 0

}}}

Inspired by X3Dom talk at Fraunhofer IGD (Sep. 2012), texts and images are adapted from the talk also


X3dom 3 rd example

X3Dom – 3rd example

Background and css styling

<x3d width=“400” height=“300”>

<scene>

<shape>redbox</shape>

</scene>

<backgroundskyColor=“0 0 0”></background>

</x3d>

<x3d width=“400” height=“300” style=“background-color:#000”>

<scene>

<shape>redbox</shape>

</scene>

</x3d>

Test it !

Inspired by X3Dom talk at Fraunhofer IGD (Sep. 2012), texts and images are adapted from the talk also


Vrml x3d x3dom

VRML / X3D / X3Dom

basic primitives, indexed face sets

materials, textures, lights

background, fog

interpolators,

! inlines !

Inspired by X3Dom talk at Fraunhofer IGD (Sep. 2012), texts and images are adapted from the talk also


X3dom vrml

X3Dom – VRML

  • LOD

  • Bilboard

  • DEF / USE

  • Elevation grid

  • Extrusion

  • <lodrange='15 30 40'>

    • <tr..><shape>redbox</shape></..tr>

    • <group></group>

  • </lod>

Test it !

<shape DEF=‘obj1’ >...</shape>

<shape USE=‘obj1’ />

<elevationgridxDimension= zDimension= xSpacing= zSpacing=

height=‘ array of scalars ’ >

<color color=‘ array of colors ’ />

</elevationgrid>

<extrusion creaseAngle=‘.9’ crossSection=‘array of 2f’

orientation=‘array of 4f’ scale=‘array of 2f’

spine=‘array of 3f’></extrusion>

Test it !


X3dom animation

X3Dom animation

<scene>

<transform DEF='boxTr'>

<shape>green Box</shape>

</transform>

<timeSensor DEF='time' loop='true' cycleInterval='5'></timeSensor>

<orientationInterpolatorDEF='rotace' key='0 0.5 1'

keyValue='0 0 1 0 0 0 1 3.14 0 0 1 6.28'></orientationInterpolator>

<ROUTE fromNode='time' fromField='fraction_changed' toNode='rotace'

toField='set_fraction'></ROUTE>

<ROUTE fromNode='rotace' fromField='value_changed‘toNode='boxTr‘

toField='set_rotation'></ROUTE>

</scene>

  • ColorInterpolator, CoordinateInter., NormalInter., OrientationInter., PositionInter., ScalarInter.

Test it !

Test it !


Missing in x3dom

missing in X3Dom

  • Newly proposed X3D profile

    • HTML profile, is extended X3D-Interchange profile

  • Not supported nodes

    • Script

      • It is completely replaced by browser javaScript

    • PROTO

      • Can be compensate by javaScript nodes generation


New in x3dom

new in X3Dom

shadows

<directionalLight direction='0 0 -1' intensity='1‘

shadowIntensity='0.7'> </directionalLight >

Note: only implemented for the first <directionalLight> in the scene

DOM holds structure and data

More than 95% are usually unstructured data !

Test it !

  • Indexed triangle set

  • faster for viewing -> viewer do not run tesselator

  • any -1 in index attribute

Inspired by X3Dom talk at Fraunhofer IGD (Sep. 2012), texts and images are adapted from the talk also


New in x3dom1

new in X3Dom

  • New Geometry Node Types

  • <imageGeometry--some attributes-->

  • <ImageTexturecontainerField='coord' url='“imgeo/coordImage0.png"'/> <ImageTexturecontainerField='normal' url='“imgeo/normalImage.png"'/> <ImageTexturecontainerField='texCoord' url='“imgeo/texCoord.png"'/>

  • </imageGeometry>

  • <binaryGeometryvertexCount='1153083' primType='"TRIANGLES"'

  • position='19.811892 -57.892578 -1.699294'

  • size='92.804482 159.783081 26.479685'

  • coord='binGeo/BG0_interleaveBinary.bin#0+24' coordType='Int16'

  • normal='binGeo/BG0_interleaveBinary.bin#8+24' normalType='Int16‘

  • color='binGeo/BG0_interleaveBinary.bin#16+24‘ colorType='Int16' >

  • </binaryGeometry>

  • Indexed geometry is binary coded in separate files (less kB)

  • Browser hold data in binary format (as images) outside of DOM

Inspired by X3Dom talk at Fraunhofer IGD (Sep. 2012), texts and images are adapted from the talk also


New in x3dom2

new in X3Dom

  • LOD

    • VRML approach

    • PopGeometry -progressive streaming

  • Shaders

    • Predefined

      • Normalmapping

      • Displacementmapping

    • User defined vertex and fragment shaders (in X3Dom file)

Test it !

Test it !

Test it !

Test it !

Test it !

Test it !


To x3dom

… to X3Dom

…converters

Inspired by X3Dom talk at Fraunhofer IGD (Sep. 2012), texts and images are adapted from the talk also


Vrml to x3d

VRML to X3D

  • By HAND in text editor 

  • Using converter of third sides (lossy)

    • Meshlab, Deep Exploration, Accutrans,…

  • VRML to X3D can be TRANSCODED

    • on-line (instant reality encoding converter)

    • off-line (aopt tool from Instant Reality package) – higher trans. control

    • animations, scripts, and code optimizations

    • transcode all variants (VRML97, X3D, X3Db, X3Dom)

Inspired by X3Dom talk at Fraunhofer IGD (Sep. 2012), texts and images are adapted from the talk also


Aopt tool 1

aopt tool 1

  • Basic transcoding output parameters:

  • aopt –ifoo.wrl –x foo.x3d

  • aopt –ifoo.wrl –b foo.x3db

  • aopt –i foo.x3d –N foo.html

  • aopt –i foo.x3d –Mfoo.xhtml

  • aopt –i foo.x3d –u -N foo.html

    • -u: optimization build DEF/USE

  • aopt –i foo.x3d –vfoo.wrl

Inspired by X3Dom talk at Fraunhofer IGD (Sep. 2012), texts and images are adapted from the talk also


Aopt tool 2

aopt tool 2

  • Output optimization (binary geometry):

  • similarly for geometry images (-g)

  • mkdirbingeo

  • aopt –ifoo.wrl –G “bingeo/:is” –xfoo.x3d

    • 4 bin files (coord, index, normal, texCoord/color)

  • aopt –ifoo.wrl –G “bingeo/:saI” –xfoo.x3d

    • 1 bin file, interleaved values (coord, normal, color/texCoord)

  • Parameters:

    • i: index

    • s: trianglestrip

    • a: autoindex (coordIndex have to be smaller than 16bit = 65.535)

    • c: compact (16bit representation for vertex attributes)

    • p: normal in spherical coordinates

    • I: interleaved (16bit interleaved vertex data)

Most compact option ?

sacp

Inspired by X3Dom talk at Fraunhofer IGD (Sep. 2012), texts and images are adapted from the talk also


Aopt tool 3

aopt tool 3

  • Huge mesh optimization (binary geometry):

  • aopt –imodel.wrl –u –b model-clean.x3db

    • Model cleanup (-u) + binary output for smaller files (-b)

  • aopt –i model-clean.x3db –FScene –b model-opt.x3d

    • Mesh patching (geo. is splitted for 16bit indices) for specified node

  • aopt –i model-opt.x3d–G “bingeo/:saI” –Nmodel.html

    • Final optimisation with binGeo for HTML/X3Dom

  • aoptcan work with VRML/X3D files and possibly with others(.ply, .obj, …)

  • ooptis better for converting other formats to x3d and than useaoptfor optimization

Inspired by X3Dom talk at Fraunhofer IGD (Sep. 2012), texts and images are adapted from the talk also


X3d editor

X3D editor

https://savage.nps.edu/X3D-Edit/


Examples

examples

  • http://examples.x3dom.org/IG/syn/index-inline.html

  • http://www.3dcoform.eu/x3dom/

  • http://leyfi.felk.cvut.cz/courses/mvr/gocar/

  • http://x3dom.org/x3dom/example/x3dom_bmwConfig.html

  • http://x3dom.org/x3dom/example/x3dom_canvas.html

Inspired by X3Dom talk at Fraunhofer IGD (Sep. 2012), texts and images are adapted from the talk also


Howto x3dom

howto X3Dom ?

Entry points for getting started

  • X3DOM online documentation and code examples

    • http://x3dom.org/docs/dev/ (tutorials and docs)

    • http://www.x3dom.org/school/ (12 simple examples)

    • http://www.x3dom.org/iX/ (7 examples with animation)

    • http://www.x3dom.org/x3dom/test/functional/ (lots of feature tests)

  • More docs and tools

    • http://www.instantreality.org/downloads/ (InstantPlayer and aopt converter)

    • http://doc.instantreality.org/documentation/getting-started/ (links to X3D)

Inspired by X3Dom talk at Fraunhofer IGD (Sep. 2012), texts and images are adapted from the talk also


End of this part

… end of this part

  • Following lecture

    • X3Dom scripting – DOM manipulation & jQuery

    • Interaction and manipulation (HUD and sensors)

    • PROTOs

    • AR in X3Dom

34


End of this part1

… end of this part

  • Todo:

  • Přidat ukázky animací a routování

    • bitLODGeometry / texture

    • http://www.x3dom.org/x3dom/test/functional/BVHRefiner.html

    • Shadery, cube map

  • Uděláme z toho samostatnou přednášku X3D + X3Dom

  • Možná další příklady X3D / VRML (vztah k 1.)

  • X3dom + js (interakce, prototypy, shadery, ar?)

35


  • Login