Lighthouse3d.com

Send me bugs and suggestions, please
VRML Script Tutorial
Full list

VRML Interactive Tutorial

Introduction
VRML File Structure
Drawing: Shape node
Geometry Nodes:
Box
Sphere
Cone
Cylinder
PointSet
IndexedLineSet
IndexedFaceSet
Extrusion
ElevationGrid
Example: Chessboard
Text
FontStyle
Appearance
Material
Textures
Image Texture
Movie Texture
Pixel Texture
Texture Coordinate
Texture Transform
Let there be Light
Directional Light
Point Light
Spot Light
Materials with Colored Lights
Hierarchical Node Structures
Group
Transform
Collision
Anchor
Billboard
Switch
Inlining Files
Defining and Instancing Nodes
Defining Levels of Detail
Events in VRML
Creating Paths between events: ROUTE
Generating Events based on Timers or User Actions
Timers
Touch Sensor
Visibility Sensor
Dragging Sensors
Plane Sensor
Sphere Sensor
Cylinder Sensor
Proximity Sensors
Example: Proximity sensor
Interpolators
Color
Coordinate
Normal
Orientation
Position
Scalar
Example
Let the Music Play
Sound
AudioClip
Bindable Nodes
Who Am I: NavigationInfo
Where Am I: ViewPoint
Adding Realism to the world
Background
Fog
Information about your world
WorldInfo
Definition for Auxiliary Nodes
Coordinate
Color
Normal

[}8{)0 ~Cv٫{Uf*%``'{{>`ml.51RwZVK"[?៿fty񺥪|O{x#fڢ{pj8T?މ<7q2by(9\ c{yFKg~˒7rbžР =vv*=ڵ$65~oFª37/{= S[lt/0#ps,Jv96HbGg1rOF~GS,( ]WZh_ط,"I;Qx)p{L=1R >nPA֔8ďh (Ngx=I=/M(3&=&@1EPF yr]ʞm9oI4hr+h=L?x1 b>y0alc]O(q/b<;L)D8A Hq{^"2yX':gͮfh{o={]TDP8C4L0ri]&(%G+R:ݳN 1 U0jm xi=1خ%|I 4R8]fΖuWBy)ǛvdJ8Nh2 !?S4GR X֞P$ {i "owGK(Dey qf n`0հPء <EqdhQ`>% <致mHZJXM&莚\ bKWro<&$ v^|*ĶmOa-N7N>3?P;Q8>um>=}zS(\~"$?QkWXʄ䛛VU|N:|:~U-}H:[qkrZ)ȳC6m?1'bM$׹uo3,(-Bm=?4޲Y*<_h;'MOCЩ%{σq;6 נĻe@3Oeل9[VAp+*P0B)QXJdKHct?`McF <Şam+~~$> @zy͋W'`S ), ;Q֟%=5JS`P e(J} U ,y B{R,Y?f2L7+2ߓhiU7v a:`RjӶدfy]x3:1{&o}ZZ691 ĕmA 1FUG}'E0G ;,,9zwZLlQH;3&#!jd`jx$x^s]0H0C3{`' [@E0 @ھ SŽjaue3`t0cu0$/jO"˪|X4)TߑAc]6Cʞ3i.\Mi 8,\)vpwE 7?CUFDg9Pw}|}BEMHg:k@mP4ڃ1~nAf#QR=]!uFQ#HhD#Y :g!ӇGɆ@8٫q۫0Q0-#8Ka'3uJM&`NLʦl-M̌?pQɇd Kdzbt^N3zCê Sd,0 [ Vu&ck >R6LvM9&Lmm|`N28%qHcdiU yiW9DxI=+,a*;`_U e3ƗLC1P,cm$zK0 13X] t*FaUL#o 8nc',A L(ԃ$9nXcLfOitV[x|{`?s(dhCix,,*1 Y#K`{U'?yN!6't7(W+ 5 u+ fu.j=_,N>\8{F4 ?ӈ73 <g.kbd/>Ez/U$jCVXІ'ksoM"g=(y=^MoΗ "!6E2$e[ AJGLILaX.=xzq2>;s^vgI 3~ۙ*13 =$8Q ;'WOGR82sN7.XtX͓9C}(B:©;b)RkZ6)2y&s.v~ y5cOjiQw=|J +?OBJ\ڋm/:7w_;F KT"I@T#LB_g /xd-@+Q7!6?rqq$]Y4WǓn!1:1xTm& ,a~>.p:TuBaYLEYL"y? ,_DX I1OL9C䤱3=g߇ʠtk"Jyz:;;=ܠseX|7dй+?\$ɤl%x:I6:H7<EG}C{hϪX^7VȈ$!rQXI)ÉPN ՁEƓy$cPJw]@2Pzq'" ; D3<)٩&'X0;3~-ag? h dLE[v`e!DJNX[2$I)oTA+(T8ԾwWLe'üOs 㫡 3v )3~bNS--0" :>p ;cvnjnb|j\Jmv0*-1݂Jbj3aO7 vK>sOCbkUI3šueYGgAVKIiűH/I=';^W0`Ao `74I;?qOK1s|6 zVEކ9cLG.I5ip?44V-UUQQ{әA4gtgրuG̮Lp V_܀,f[5n(5$\JgH휆\Je|f}{-=@CN`_ VѺEymb0L ? 7q:H?"C7Q<=)^1d%lut`7<g<Dz%bc?=V CV^d`nxJ1T8֛xPm2>]xhPLDA}&#'co0%" t8K8T FXmI sss|fuX-j˹'L@yNǁh8kk" &t^%&S:WU1|LA3#m۳Ŀں=j|"8Z ]|ύGvÎ( C1AA"'w(l~a!R᛿ ˢ&P7ߴ0Q65^n"(ȞIփQqFGNyլȱZ[58 h?7`DY0Bz4w-ht60d )؟Mћ tښxV1Nd)mE$=ڸph?JgZ)yh_bE`+360 T享T``R@bdㅹw[;VZmg! 3낊$ '؊g3#|ْh0:Su"Y[ujLUUO_.Tdx]+O M\*W3LpHQ悡C e檅rK\\C!K0w 5']Qs۸~g8/SJ$HJ$q'ĭCK1E(I c@4/7}$vgx|JY +l`4 VeXHVYO0Ռj_dQS>vtҳv:?*}3OιZ@iK`F)@ءIpp`iŠs7YzѳCUQ(HFGQ:w; xpB=t0rn{kH:cҠ^})g2E/C# l5$KvIY>Q`mЇ%֫yV%ٜ@VE|L .Ȳw+W൜bBXUO,mj6~a0su;9xjrEf,7Im$8 |q/@eE5O|ٲr}Nzta6Oaݭc(`<G8 |c[tۖ*ъl^ .JK-X%˨>)x0؏/GDK>Vz\Rm[{0[}+J$Gaecɧ໸rhL:TGl &}SƔI9c>4am{pqÈ#ZKU$`%%0'tϧ8M }H ~,:A[,/7z%>nuT^tf8:V'*`>/ R>H U:8u~“ e zo:n ܶ$WuW*fC\f~L'էnvrK@Iѧe2_ #ol/& Pa M$$'#`Q0!,fZ<nRI `@oHib RHm D̹*sFK)uڹX|cnSTa pp &SFkFrp-ܜs9:%%Ԋ~ ծƲ%j&F*9h]8bx~H4g Sd֟`頌>fGJ.!)v`%/t F6{)H F|/ϕ #j D]+ )t:.}?sY5K'ͩ(uO68Srsa;yw޳^ &ʄGooy.# }tI=?X8tI=.A% ^zM)> h.D>}3vFwBzi<S0d봼Y^i`VtH ,G+N5zxmcux`lUdPihcUxrʹF[+^ybh].׳v sPO~G9}9(j=sv!z6U.4V}Zm,/: R j=htNfIqUlg'߾S`?xԯ,cQ1_]nF}vՋԅٵ (N$(- HqeHr]rIQsAMróC rųىVjK(wώ># NrLҍΙ(v]eR0}o8^d$&C-Yuڊ.0 &B hp*I)ђ!6oF20͈JVf.^F`7sajrXA]uqL`p:`WƣXr;L 辤m ~=3;^y+ :Q?ݕi\f&+H Oһm#6Rs~RIĻzastZo6onU^|PQq9#I "_<+yVOx|gﭛsy"ң{Q*ejU#s#=hR2לj3^STtӆ*8{ܻ[N=_ VbDY΀L-]ZuCOGy8[8 j$e|xbFO{sg 3xjY,^-Љ+k,*لdW煰N\x4kZM^Rj(\z# 5YkJՐ9+Xu8,^)@c`e7Zٍ9ՅH P8^y&pZ-:aA95`@T q1a+YD)j݌fz($ @Wq7W*F1X< gpx@C9^]rgчwE Yd,7G )"X+vwAZd4 Bbn5uvMRrs BEB<klCZ9lFJHcOܪa1l8<|])q36m|n zCUwT-xE*d%?p!ՔC #c]… eОV6`f7};WLqc4;9<< 7;yb4MBY!ON x[is};FS]]&i'i /W>Y7)2?iIvvOBJ;tP"yҭli7:O=Q0-]

LOD Node


LOD stands for Level of Detail. This node lets you specify alternative representations of a graphical object, and the distance ranges to use each representation.

The following fields are defined:

  • level specifies the set of alternative representations of a graphical object
  • center specifies a 3D point to which the distance is computed.
  • range specifies a set of distances, floating point values greater than or equal to zero. There must N distances specified, if N+1 levels are specified. The distances must be ordered starting from the smaller distance, otherwise the results are undefined. If this field is left empty then this is a hint to the browser telling it that it should select a level where a constant display rate can be accomplished.



  • Syntax:
    LOD {
    level []
    center 0 0 0
    range []
    }


    This node can have a major impact on the performance of a browser, therefore its role can't be overstated. Look at the following figure

    In it you see three cones. The left one which isn't really a cone, more like a pyramid, has only four sides, the middle one has 8 sides, the right one has 16 sides. These cones were created using Extrusionnodes.

    You can see that they are different by the way they reflect light. Now look at the next figure.

    The above figure includes the same three cones but placed further away from the user. It is becoming difficult to distinguish between the right and middle cones, although you can still clearly see the difference between the left cone and the other two.

    In the above figure the user is further away from the cones than in the previous figure and as a result it is harder to distinguish which is the more detailed, and the less detailed cone.

    This sequence of images shows that with distance the perception of the details in an object becomes harder. This is the reasoning behind the LOD node. Why draw very complex shapes when they are too far away from the user for details to be recognized? The more complex a shape is the more demanding is the task of drawing it. If an object is far away there is no benefit in drawing the object full of detail.

    The LOD node can be used in the following way:

  • if the user is close to the object draw the most detailed version
  • when the user is not close anymore, but still not to far away draw a less detailed version
  • when the user is very far away draw only a crude version of the object.
  • By selecting less detailed versions when the user is not close to a object, time is saved and the user perceives no difference due to distance. You can specify as many levels of detail as desired. The user should try to keep changes from one level of detail to the next as small as possible so that a performance break will not occur.

    The LOD can also be used to avoid drawing objects which are invisible, for instance in another room. In this case one can specify an empty object, for instance a Shape without a geometry.

    The range field specifies which version of the object is drawn. The objects should be specified in the level field by decreasing level of detail. If the distance from the user to the object is smaller than the first range specified, then the first version, the more detailed, will be drawn, if the distance is between the J-1 and J ranges, then the Jth version is drawn. If the distance is greater than the last range specified, with an index I, then the Ith version is drawn.

    The main problem is knowing how much is "close", "not to far away", and "very far away". This is perhaps something the browser developers should think about, providing coordinates for the user's position.

    If browsers did provide the user's position then one could have the several versions with different levels of detail of the object drawn at the origin, then the user would move away from the objects until no difference was perceived between the full detailed version and a slightly less detailed version. The user's position could then be used to compute the distance when the level of detail should be changed. This procedure would be repeated for all levels of detail until all versions looked the same.

    Unfortunately most browsers do not provide the user's position so it becomes a matter of trial and error.

    Source code exemplifying the use of a LOD node:


    Example:
    #VRML V2.0 utf8
    
    LOD {
        range [20,40]
        level [
    	#full detail 16 sided cone
    	Shape{
    		appearance Appearance {
    			material Material { 
    				diffuseColor 1.0 1.0 1.0
    			}
    		}
    		geometry Extrusion{
    			crossSection [ -1 0, 0 0, -1 -2 -1 0]
    			spine [1 0 0 , 0.866 0 0.5,
    				0.5 0 0.866, 0 0 1 ,
    				-0.5 0 0.866, -0.866 0 0.5,
    				-1 0 0, -0.866 0 -0.5,
    				-0.5 0 -0.866, 0 0 -1 ,
    				0.5 0 -0.866, 0.866 0 -0.5,
    				1 0 0
    			]
    		}
    	}
    	#intermediate detail 8 sided cone
    	Shape{
    		appearance Appearance {
    			material Material { 
    				diffuseColor 1.0 1.0 1.0
    			}
    		}
    		geometry Extrusion{
    			crossSection [ -1 0, 0 0, -1 -2 -1 0]
    			spine [1 0 0 , 0.707 0 0.707 ,
    				0 0 1 , -0.707 0 0.707,
    				-1 0 0,-0.707
    				0 -0.707, 0 0 -1 ,
    				0.707 0 -0.707, 1 0 0
    			]
    		}
    	}
    	#low detail 4 sided cone
    	Shape{
    		appearance Appearance {
    			material Material { 
    				diffuseColor 1.0 1.0 1.0
    			}
    		}
    		geometry Extrusion{
    			crossSection [ -1 0, 0 0, -1 -2 -1 0]
    			spine [1 0 0 , 0 0 1, -1 0 0,
    				0 0 -1 , 1 0 0
    			]
    		}
    	}
         ]
    
    }