SI31 Advanced Computer Graphics AGR

1. SI31Advanced Computer GraphicsAGR Lecture 11 VRML - An Introduction

2. Good Ideas are Simple • Realization 1: • Hypertext + Internet = World Wide Web • Realization 2: • Adding images makes pages more interesting • Realization 3: • Images are pictures taken by the publisher - why not send 3D scenes and allow the user to take the picture! • VRML: Virtual Reality Modelling Language • a language to describe 3D worlds - for the Web

3. World Wide Web Pages INTERNET AUTHORINGPROCESS WEBBROWSER HTML file text/ html .html MIME type server client

4. INTERNET AUTHORINGPROCESS VRMLBROWSER VRML file x-world/ x-vrml .wrl server client VRML Major browsers: CosmoPlayer WorldView Cortona Blaxxun

5. Advantages of VRML • Transferring a 3D model - rather than a 2D image - to the browser has great advantages • viewer can choose how to look at the model - or world • viewer can navigate the world • file size can often be much less

6. How Did It All Begin? • Original brainwave • Mark Pesce and Tony Parisi - early 1994 • vision of a VR interface to the Web • VRML 1.0 • practical realisation based on Open Inventor (Silicon Graphics toolkit - similar to OpenGL but higher level) • Open Inventor file format PLUS hyperlinks • static, non-interactive worlds • Gavin Bell (SGI) - late 1994

7. Where are we now? • VRML97 • adds object behaviours and interaction to allow creation of dynamic worlds • ISO standard - December 1997 • Gavin Bell, Rikk Carey (ex-SGI) and Chris Marrin (SGI) • 2001 • being reworked as XML (X3D) • many new developments

8. #VRML V2.0 utf8 Shape { geometry Cylinder { radius 3 height 6 } } A VRML File • VRML file consists of: • header • nodes • ‘Shape’ is the generic geometric node • specific objects such as cylinders and spheres • operations such as transformations • fields • parameters of nodes

9. #VRML V2.0 utf8 Shape { geometry Cylinder { radius 2 height 4 } } As Seen By A Browser

10. #VRML V2.0 utf8 Shape { geometry Cylinder { radius 2 height 4 } appearance Appearance { material Material { diffuseColor 1 0 0 specularColor 1 1 1 } } } Adding Colour to the Scene

11. Each node is drawn within its own local co-ordinate system.. Co-ordinate Systems y x z

12. ...and can be subjected to a modelling transformation to scale, rotate, translate Transform is a VRML node - treated just like an object It applies to a group of children nodes Modelling Transformations #VRML V2.0 utf8 Transform{ scale 5.0 0.5 1.0 children [ Shape { geometry Cylinder { radius 2 height 4 } appearance Appearance { material Material { diffuseColor 1 0 0 specularColor 1 1 1 } } } ] }

13. Hierarchical Structure #VRML V2.0 utf8 Transform{ scale 5.0 0.5 1.0 children [ Shape { geometry Cylinder { radius 2 height 4 } appearance Appearance { material Material { diffuseColor 1 0 0 specularColor 1 1 1 } } } ] } parent TRANSFORM child SHAPE

14. This generalises to allow nodes to appear in a hierarchy This is known as the VRML scene graph Hierarchical Structure TRANSFORM TRANSFORM SHAPE SHAPE SHAPE

15. Here we see Cylinder, Sphere and Cone nodes Each has been subjected to a modelling transformation in order to position them Transformations

16. A node can be given a ‘name’ and then used multiple times - with different transformations applied to each DEF kwb Shape {...} gives it a name USE kwb allows it to be included at other points in the scene graph Instances

17. A piece of geometry can act as a link to another URL Anchors

18. Texture mapping: Images can be mapped to geometry to provide texturing VRML looks like: Shape{ geometry Sphere { } appearance Appearance{ texture ImageTexture{ url “http://..../kwb.gif”} Textures

19. The general primitive for drawing polygonal surfaces is: IndexedFaceSet coord field lists the points coordIndex describes the polygons Shape{ geometry IndexedFaceSet { coord Coordinate { point [ 17.5 11.2 -1.2, 17.5 15.0 -1.2, … ] } coordIndex [ 0 1 2 3 -1, 4 1 0 5 -1, …] } } Polygonal Surfaces

20. VRML includes: DirectionalLight PointLight SpotLight Note # sign is a comment Example: PointLight{ on TRUE intensity 0.75 color 1 0 0 #red location 0 0 0 radius 100 } Lights

21. Specified via the Viewpoint node VRML file can have a number of Viewpoint nodes - browsers allow a user to jump from one viewpoint to another Orientation = axis + angle of rotation Example: Viewpoint { position 0 0 5 orientation 0 0 1 0.3 description “frontview” } Viewing

22. Other Basic Features • Inline node • incorporate VRML code from another url • this allows us to compose large worlds from many smaller ones • Level of Detail • different geometric representations depending on distance

23. Information About VRML • Web3D Consortium • http://www.web3d.org • links to specifications and resources • new SDK just released • Web3D Information • http://web3d.about.com/compute/web3d • Tutorials include: • Floppy’s guide: www.vapourtech.com/vrmlguide • Many, many examples: • eg www.intoronto.com

24. Books • Range of books now available • The VRML 2.0 Handbook (Addison Wesley) Jed Hartman and Josie Wernecke • The Annotated VRML Reference Book (Addison Wesley) Rikk Carey and Gavin Bell http://www.best.com/~rikk/Book/