WWW5 tutorial: VRML Selected by PC Webopaedia


introduction:

mark d. pesce gave an introduction to VRML, which allows to model three-dimensional scenes. VRML stands for "Virtual Reality Modeling Language". it derived from HTML and used to be called "Virtual Reality Markup Language", but the meaning of the "M" has been changed to "Modeling". VRML may be used to include 3D-graphics and virtual reality models into hypertext documents. VRML browsers allow to explore a scene by walking through the model (also known as "a world"), approaching and examining objects etc. currently, there are about twenty VRML browsers to choose from. Microsoft and Netscape have announced that they will include VRML browsing capabilities in their future versions of their Web browsers (actually, there is already a plug-in available for the Microsoft Internet Explorer, plug-ins for other browser are available as well).

the current version of VRML is V1.0, V2.0 is expected to become the new standard before the end of 1996. the current status of the VRML standard is available here.


concepts of 3D graphics:

there are three fundamental objects in 3D graphics: the viewer , the object to be viewed and the light . the objects are defined in "object space" , also known as "a scene" or "a world". there are four basic shapes called "primitives" :

  1. cube
  2. sphere
  3. cone
  4. cylinder

more complex shapes can be defined as a set of 3D coordinates. the appearance of an object is defined by various properties:

cameras are the means to "look" at a scene. if multiple cameras are defined, VRML browsers usually make them available through a menu.

the default file type of VRML documents is ".wrl" for "world". a MIME-type for VRML is proposed but not yet accepted as a standard (therefore "x-"). it will be defined as "world/vrml", but for now one has to use "x-world/x-vrml".


creating 3D models:

there are many ways to create VRML: simple text editors, converting tools or 3D modelers.
this is a first example of a simple scene or world:

#VRML V1.0 ascii
Separator # sample1.wrl
{
	Separator
	{ # red sphere translated along the negative X axis
		Translation { translation -1.5 0 0 }
		Material { diffuseColor 1 0 0 }
		Sphere {}
	}
	Separator
	{ # blue cube translated along the positive X axis
		Translation { translation 1.5 0 0 }
		Material { diffuseColor 0 0 1 }
		Cube {}
	}
	Separator
	{ # green cone translated along the negative Y axis
		Rotation { rotation 0 0 1 3.14 }
		Translation { translation 0 -2.5 0 }
		Material { diffuseColor 0 1 0 }
		Cone {}
	}
	Separator
	{ # yellow cylinder translated along the positive Y axis
		Translation { translation 0 -2.5 0 }
		Material { diffuseColor 1 1 0 }
		Cylinder {}
	}
}

if you enter the scene which source code is shown above, you should see a red ball (or sphere) on the left, a blue cube on the right, a green cone pointing downward above and a yellow cylinder below them.


on the second example below, the logos of the past five international WWW conferences will be applied to the faces of a cube. on the sixth face, the text "World Wide Web" will be applied. the cube itself is an anchor, if you click on it, then the first example will be loaded.

this is the source code:

#VRML V1.0 ascii
Separator # www5: sample2.wrl
{
	WWWAnchor {
	    name "sample1.wrl"
		Coordinate3 { point
			[ -1 1 1 , 1 1 1 , 1 1 -1 , -1 1 -1 ,
			  -1 -1 1 , 1 -1 1 , 1 -1 -1 , -1 -1 -1 ] }
		Material { diffuseColor 1 1 1 }
		IndexedFaceSet { coordIndex [ 0 , 4 , 5 , 1 , -1 ] }
		Texture2 { filename "www1.gif" }
		IndexedFaceSet { coordIndex [ 1 , 5 , 6 , 2 , -1 ] }
		Texture2 { filename "www2.gif" }
		IndexedFaceSet { coordIndex [ 3 , 2 , 6 , 7 , -1 ] }
		Texture2 { filename "www3.gif" }
		IndexedFaceSet { coordIndex [ 0 , 3 , 7 , 4 , -1 ] }
		Texture2 { filename "www4.gif" }
		IndexedFaceSet { coordIndex [ 0 , 1 , 2 , 3 , -1 ] }
		Texture2 { filename "www5.gif" }
		IndexedFaceSet { coordIndex [ 7 , 6 , 5 , 4 , -1 ] }
		Texture2 { filename "" }
		FontStyle { size 0.4 }
		Material { diffuseColor 1 0 1 }
		Translation { translation -0.6  0.3 1.05 }
		AsciiText { string "World" }
		Translation { translation  0.0 -0.5 0.0 }
		AsciiText { string "Wide" }
		Translation { translation  0.0 -0.5 0.0 }
		AsciiText { string "Web" }
	}
}

instances versus inlines:

VRML provides two ways of reducing the number of nodes that are used in a world file: instances and inlines.

instancing allows to define and then reuse an object with the DEF and the USE statements. it shall be noticed that the DEF statement also instances the object, it actually names an existing object in a scene.

inline on the other hand allows to include objects that are defined in another world file. inlines are accomplished with the WWWInline node, whereas the name field takes the pathname (URL) of the world file being inlined. as an option, a bounding box may be specified, which gives the user an indication of the object's location and size while it is being loaded into the scene.


anchor:

WWWAnchor provides the same feature as HREF in HTML. when the user selects the object defined in the anchor, a new scene will be loaded.


level of detail:

the level of detail (LOD) feature allows to start with smaller, less detailed scenes and make them more complex and detailed as the viewer gets closer to the object. the LOD node defines one or more "switch points" in meters, where an object changes its appearance.


VRML standards:


conclusion:

this tutorial was a perfect introduction to VRML. i used to believe that VRML would be something extremely complex and complicated, but within four hours, i have learned that it is not too difficult to get started. this does not mean that it is a simple task to build a useful model, i'm only saying that i think that i got the idea and that i'm now very motivated to learn more about VRML.


additional URLs of interest:


back to WWW5 main document.


WWW5 tutorial 2 / 14-jul-1997 (ra) / reto ambühler -¦¦- 09-nov-1998 (ra): broken links fixed or removed