天天看点

Control WRL embedded in html using Javascript

In my last artitle,I?discussed the?Java EAI mode?to control the vrml. Well,the eai mode?is powerful? because of the powerful java support.Usually for those not very complicated?communication cases,the eai mode is not recommended.Today I'll show the more common tool to realize the vrml control,most people have use this tool very frequently for web design,special page effects,and so on.That's it --the JAVASCRIPT.

Using javascript to control your wrl,you should be very familiar with your VR contents:the object names,the node tree,the interpolators,the sensors,the times and the touch or driven relationship between them.That's very important and you should design the vrml file's struct when you considering the whole web page.What you want to show to the consumer or clients,how to show the product or the process of the assembling or other things,you should take this into consideration and design the html and the vrml.

This article assumes you are familiar with VRML,JavaScript,Html.

The first example is to control the coordiantes of one moving object in the VR.It's very easy and its code is capable of?self-explanation.

The coordinate.htm:

Control WRL embedded in html using Javascript

<!DOCTYPE?HTML?PUBLIC?"-//W3C//DTD?HTML?4.0?Transitional//EN">

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

<HTML><HEAD><TITLE>Nasky??VRML?simple?test-for?students?and?beginners</TITLE>

Control WRL embedded in html using Javascript

<META?http-equiv=Content-Type?content="text/html;?charset=gb2312">

Control WRL embedded in html using Javascript

<META?content="MSHTML?6.00.2900.2180"?name=GENERATOR>

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

<SCRIPT?language=JavaScript>...

Control WRL embedded in html using Javascript

var?i;

Control WRL embedded in html using Javascript

var?j;

Control WRL embedded in html using Javascript

var?k;

Control WRL embedded in html using Javascript

var?timer;

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

function?M_o()

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

...{?

Control WRL embedded in html using Javascript

clearTimeout(timer);

Control WRL embedded in html using Javascript

M_e=Scene.Engine;?

Control WRL embedded in html using Javascript

M_e.Nodes("my_Time").Fields("enabled")=0;?

Control WRL embedded in html using Javascript

i=M_e.Nodes("my_view").Fields("translation").x;?

Control WRL embedded in html using Javascript

j=M_e.Nodes("my_view").Fields("translation").y;?

Control WRL embedded in html using Javascript

k=M_e.Nodes("my_view").Fields("translation").z;?

Control WRL embedded in html using Javascript

document.tickform.tickfield.value=i????????//瀵规????妗?杩?琛?????

Control WRL embedded in html using Javascript

document.tickform.tickfielda.value=j

Control WRL embedded in html using Javascript

document.tickform.tickfieldb.value=k

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript

function?M_input()

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

...{?

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

clearTimeout(timer);

Control WRL embedded in html using Javascript

M_e=Scene.Engine;?

Control WRL embedded in html using Javascript

M_e.Nodes("my_Time").Fields("enabled")=0;?

Control WRL embedded in html using Javascript

M_e.Nodes("my_view").Fields("translation").x=document.tickform1.tickfield1.value;

Control WRL embedded in html using Javascript

M_e.Nodes("my_view").Fields("translation").y=document.tickform1.tickfielda1.value;

Control WRL embedded in html using Javascript

M_e.Nodes("my_view").Fields("translation").z=document.tickform1.tickfieldb1.value;

Control WRL embedded in html using Javascript

}

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

function?M_c()

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

...{

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

M_e=Scene.Engine;?

Control WRL embedded in html using Javascript

M_e.Nodes("my_Time").Fields("enabled")=1;?

Control WRL embedded in html using Javascript

i=M_e.Nodes("my_view").Fields("translation").x;

Control WRL embedded in html using Javascript

j=M_e.Nodes("my_view").Fields("translation").y;?

Control WRL embedded in html using Javascript

k=M_e.Nodes("my_view").Fields("translation").z;

Control WRL embedded in html using Javascript

document.tickform.tickfield.value=i?//瀵规????妗?杩?琛?????

Control WRL embedded in html using Javascript

document.tickform.tickfielda.value=j

Control WRL embedded in html using Javascript

document.tickform.tickfieldb.value=k?

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

timer=setTimeout("M_c()",50)

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

function?textprintdown()//??瀹?涔?杩?琛??芥??

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

...{

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

}

Control WRL embedded in html using Javascript

</SCRIPT>

Control WRL embedded in html using Javascript

</HEAD>

Control WRL embedded in html using Javascript

<BODY?leftMargin=0?topMargin=0>

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

<p?align="center">&nbsp;</p>

Control WRL embedded in html using Javascript

<p?align="center">

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

?? <object?id=Scene?type=application/x-oleobject?height=337?width =571?

Control WRL embedded in html using Javascript

??????classid=CLSID:86A88967-7A20-11D2-8EDA-00600818EDB1>

Control WRL embedded in html using Javascript

???? <param?name="WaitForAllResources"?value="0">

Control WRL embedded in html using Javascript

???? <param?name="Scene"?value="aaa.wrl"?ref>

Control WRL embedded in html using Javascript

???? <param?name="RendererName"?value="DirectX?Renderer">

Control WRL embedded in html using Javascript

???? <param?name="NavigationBar"?value="1">

Control WRL embedded in html using Javascript

???? <param?name="ConsoleMode"?value="0">

Control WRL embedded in html using Javascript

???? <param?name="ShowFps"?value="-1">

Control WRL embedded in html using Javascript

???? <param?name="ShowRenderingTime"?value="0">

Control WRL embedded in html using Javascript

???? <param?name="ShowProgress"?value="-1">

Control WRL embedded in html using Javascript

???? <param?name="RendererHints"?value="1024">

Control WRL embedded in html using Javascript

???? <param?name="Collider"?value="0">

Control WRL embedded in html using Javascript

???? <param?name="ColliderMode"?value="0">

Control WRL embedded in html using Javascript

???? <param?name="HeadLight"?value="-1">

Control WRL embedded in html using Javascript

???? <param?name="NavigationMode"?value="3">

Control WRL embedded in html using Javascript

???? <param?name="viewpoint_transition_mode"?value="0">

Control WRL embedded in html using Javascript

???? <param?name="show_hidden_viewpoints"?value="0">

Control WRL embedded in html using Javascript

???? <param?name="TravelSpeed"?value="3">

Control WRL embedded in html using Javascript

???? <param?name="BackColor"?value="12632256">

Control WRL embedded in html using Javascript

???? <param?name="ShowLogo"?value="-1">

Control WRL embedded in html using Javascript

???? <param?name="ContextMenu"?value="-1">

Control WRL embedded in html using Javascript

???? <param?name="VRML_BACKGROUND_COLOR"?value="#c0c0c0">

Control WRL embedded in html using Javascript

???? <param?name="VRML_DASHBOARD"?value="TRUE">

Control WRL embedded in html using Javascript

???? <param?name="Mask"?value>

Control WRL embedded in html using Javascript

???? <param?name="LoadDroppedScene"?value="-1">

Control WRL embedded in html using Javascript

???? <param?name="MuteSound"?value="0">

Control WRL embedded in html using Javascript

???? <param?name="Appearance"?value="0">

Control WRL embedded in html using Javascript

???? <param?name="CpuLoading"?value="80">

Control WRL embedded in html using Javascript

???? <param?name="RendererOptimization"?value="1">

Control WRL embedded in html using Javascript

???? <param?name="Skin"?value="{1706B265-E103-4332-9871-7FEE6C37C699}">

Control WRL embedded in html using Javascript

???? <param?name="NavigationStyle"?value="turn">

Control WRL embedded in html using Javascript

???? <param?name="NavigationType"?value="EXAMINE">

Control WRL embedded in html using Javascript

???? <param?name="InputDevices"?value="7">

Control WRL embedded in html using Javascript

?? </object>

Control WRL embedded in html using Javascript

<p?align="center">

Control WRL embedded in html using Javascript

<a?href="javascript:M_c()">?剧ず????</a> ?

Control WRL embedded in html using Javascript

<a?href="javascript:M_o()">??姝?lt;/a>

Control WRL embedded in html using Javascript

</p>

Control WRL embedded in html using Javascript

<p?align="center">

Control WRL embedded in html using Javascript

<table?width="631"?height="23">

Control WRL embedded in html using Javascript

?? <tr>

Control WRL embedded in html using Javascript

???? <td?width="260"?height="17"?align="center"><strong><font?size="+4">X:</font></strong>?</td>

Control WRL embedded in html using Javascript

???? <td?width="148"><strong><font?size="+4">Y:</font></strong></td>

Control WRL embedded in html using Javascript

???? <td?width="207"><strong><font?size="+4">Z:</font></strong></td>

Control WRL embedded in html using Javascript

?? </tr>

Control WRL embedded in html using Javascript

</table>

Control WRL embedded in html using Javascript

</p>

Control WRL embedded in html using Javascript

<p?align="center"><form?name=tickform>

Control WRL embedded in html using Javascript

<textarea?name=tickfield??wrap=virtual></textarea>

Control WRL embedded in html using Javascript

<textarea?name=tickfielda??wrap=virtual></textarea>

Control WRL embedded in html using Javascript

<textarea?name=tickfieldb??wrap=virtual></textarea>

Control WRL embedded in html using Javascript

</form></p>

Control WRL embedded in html using Javascript

<p?align="center"><strong>璇疯??ヨ?娴?瑙???缁?绾?搴?lt;/strong></p>

Control WRL embedded in html using Javascript

<p?align="center"><form?name=tickform1>

Control WRL embedded in html using Javascript

<textarea?name=tickfield1??wrap=virtual></textarea>

Control WRL embedded in html using Javascript

<textarea?name=tickfielda1??wrap=virtual></textarea>

Control WRL embedded in html using Javascript

<textarea?name=tickfieldb1??wrap=virtual></textarea>

Control WRL embedded in html using Javascript

<a?href="javascript:M_input()">?ц?????</a>

Control WRL embedded in html using Javascript

</form>

Control WRL embedded in html using Javascript

</body>

Control WRL embedded in html using Javascript

</html>

the vrml:aaa.wrl

?

Control WRL embedded in html using Javascript

#VRML?V2.0?utf8?

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

DEF?my_view?Transform{?

Control WRL embedded in html using Javascript

translation?1?1.2?16?

Control WRL embedded in html using Javascript

rotation?0?1?0?-1?

Control WRL embedded in html using Javascript

children?[?

Control WRL embedded in html using Javascript

DEF?my_viewpoint?Viewpoint?{?

Control WRL embedded in html using Javascript

description?"AutoRun"?

Control WRL embedded in html using Javascript

orientation?1?0?0?0?

Control WRL embedded in html using Javascript

position?0?0?0?

Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript

]?

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript

DEF?old_Viewpoint?Viewpoint?{?

Control WRL embedded in html using Javascript

description?"Entry?point"?

Control WRL embedded in html using Javascript

orientation?0?1?0?-1?

Control WRL embedded in html using Javascript

position?1?1.2?16?

Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

DirectionalLight?{?

Control WRL embedded in html using Javascript

ambientIntensity?0.8?

Control WRL embedded in html using Javascript

intensity?0.6?

Control WRL embedded in html using Javascript

direction?0?-1?0?

Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript

Shape?{?

Control WRL embedded in html using Javascript

appearance?Appearance?{?

Control WRL embedded in html using Javascript

material?Material?{?

Control WRL embedded in html using Javascript

diffuseColor?1?0?0?

Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript

geometry?ElevationGrid?{?

Control WRL embedded in html using Javascript

xDimension?4?

Control WRL embedded in html using Javascript

xSpacing?5.5?

Control WRL embedded in html using Javascript

zDimension?4?

Control WRL embedded in html using Javascript

zSpacing?5.5?

Control WRL embedded in html using Javascript

height?[0.8?0.1?0.4?0.5?

Control WRL embedded in html using Javascript

0.5?0.4?0?0.4?

Control WRL embedded in html using Javascript

0.2?0.1?0.4?0.3?

Control WRL embedded in html using Javascript

0.5?0.6?0.7?0.2]?

Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript

Transform?{?

Control WRL embedded in html using Javascript

translation?8?3.5?8?

Control WRL embedded in html using Javascript

children?[?

Control WRL embedded in html using Javascript

Shape?{?

Control WRL embedded in html using Javascript

appearance?Appearance?{?

Control WRL embedded in html using Javascript

material?Material?{?

Control WRL embedded in html using Javascript

diffuseColor?0?0?1?

Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript

geometry?Box?{size?1?1?1?}?

Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript

]?

Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript

Transform?{?

Control WRL embedded in html using Javascript

translation?15?0.6?15?

Control WRL embedded in html using Javascript

children?[?

Control WRL embedded in html using Javascript

Shape?{?

Control WRL embedded in html using Javascript

appearance?Appearance?{?

Control WRL embedded in html using Javascript

material?Material?{?

Control WRL embedded in html using Javascript

diffuseColor?0?1?0?

Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript

geometry?Cylinder?{?

Control WRL embedded in html using Javascript

height?1.2?

Control WRL embedded in html using Javascript

radius?0.4?

Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript

]?

Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

DEF?my_Time?TimeSensor?{?

Control WRL embedded in html using Javascript

cycleInterval?20?

Control WRL embedded in html using Javascript

enabled?FALSE?

Control WRL embedded in html using Javascript

loop?TRUE?

Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript

DEF?my_Position?PositionInterpolator?{?

Control WRL embedded in html using Javascript

key?[0?0.25?0.38?0.5?0.75?1.0]?

Control WRL embedded in html using Javascript

keyValue?[1?1.2?16,2?1.2?1,7?1.2?1,?

Control WRL embedded in html using Javascript

15?1.2?1,14?1.2?12,1?1.2?16]?

Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript

DEF?my_Direction?OrientationInterpolator?{?

Control WRL embedded in html using Javascript

key[0?0.25?0.38?0.5?0.75?1.0]?

Control WRL embedded in html using Javascript

keyValue?[0?1?0?-1,0?1?0?-2.9,0?1?0?3.14,?

Control WRL embedded in html using Javascript

0?1?0?2.9,0?1?0?1.4,0?1?0?-1]?

Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript

DEF?my_LookUpAngle?OrientationInterpolator?{?

Control WRL embedded in html using Javascript

key?[?0?0.25?0.38?0.5?0.75?1.0]?

Control WRL embedded in html using Javascript

keyValue?[1?0?0?0,1?0?0?0,1?0?0?0.3,?

Control WRL embedded in html using Javascript

1?0?0?0,1?0?0?0,1?0?0?0]?

Control WRL embedded in html using Javascript

}?

Control WRL embedded in html using Javascript

ROUTE?my_viewpoint.bindTime?TO?my_Time.set_startTime?

Control WRL embedded in html using Javascript

ROUTE?my_viewpoint.isBound?TO?my_Time.set_enabled?

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

ROUTE?my_Time.fraction_changed?TO?my_Position.set_fraction?

Control WRL embedded in html using Javascript

ROUTE?my_Time.fraction_changed?TO?my_Direction.set_fraction?

Control WRL embedded in html using Javascript

ROUTE?my_Time.fraction_changed?TO?my_LookUpAngle.set_fraction?

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

ROUTE?my_Position.value_changed?TO?my_view.set_translation?

Control WRL embedded in html using Javascript

ROUTE?my_Direction.value_changed?TO?my_view.set_rotation?

Control WRL embedded in html using Javascript

ROUTE?my_LookUpAngle.value_changed?TO?my_viewpoint.set_orientation?

Control WRL embedded in html using Javascript

?

the running result:

Control WRL embedded in html using Javascript

In the second example?, you can control more things,the code is also capable of self-explanation,here is the code.

the html: aa.htm

Control WRL embedded in html using Javascript

< html >

Control WRL embedded in html using Javascript

< title > Nasky?vrml?samples-js </ title >

Control WRL embedded in html using Javascript

< body >

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

< SCRIPT? language =JavaScript > ...

Control WRL embedded in html using Javascript

function?sendEvent(?)

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

...{

Control WRL embedded in html using Javascript

document.CC3D.setNodeEventIn("view1",'set_bind','TRUE')

Control WRL embedded in html using Javascript

}

Control WRL embedded in html using Javascript

function?original(?)

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

...{

Control WRL embedded in html using Javascript

document.CC3D.setNodeEventIn("view0",'set_bind','TRUE')

Control WRL embedded in html using Javascript

}

Control WRL embedded in html using Javascript

function?stop(?)

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

...{

Control WRL embedded in html using Javascript

document.CC3D.setNodeEventIn("clock",'enabled','FALSE')

Control WRL embedded in html using Javascript

}

Control WRL embedded in html using Javascript

function?start(?)

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

...{

Control WRL embedded in html using Javascript

document.CC3D.setNodeEventIn("clock",'enabled','TRUE')

Control WRL embedded in html using Javascript

}

Control WRL embedded in html using Javascript

function?change(?)

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

...{

Control WRL embedded in html using Javascript

document.CC3D.setNodeEventIn("blue",'diffuseColor','.70213?.70213?.70213')

Control WRL embedded in html using Javascript

}

Control WRL embedded in html using Javascript

function?positionshow(?)

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

...{?var?x;?

Control WRL embedded in html using Javascript

x=document.CC3D.getNodeEventOut("ok","translation")

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

document.tickform.tickfield.value=x

Control WRL embedded in html using Javascript

}

Control WRL embedded in html using Javascript

function?positiontransmit(?)

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

...{?

Control WRL embedded in html using Javascript

var?x;?

Control WRL embedded in html using Javascript

x=document.tickform.tickfield_a.value

Control WRL embedded in html using Javascript

document.tickform.tickfield_b.value=x

Control WRL embedded in html using Javascript

document.CC3D.setNodeEventIn("clock",'enabled','FALSE')

Control WRL embedded in html using Javascript

document.CC3D.setNodeEventIn("ok",'translation',x)

Control WRL embedded in html using Javascript

}

Control WRL embedded in html using Javascript

</ SCRIPT >

Control WRL embedded in html using Javascript

< object? classid ="CLSID:4B6E3013-6E45-11D0-9309-0020AFE05CC8" ?name =CC3D?

Control WRL embedded in html using Javascript

id =CC3D? WIDTH =598? HEIGHT =448? >

Control WRL embedded in html using Javascript

???? < param? name ="SRC" ?value ="box.wrl" >

Control WRL embedded in html using Javascript

???? < embed? name =CC3D? src ="box.wrl" ?type ="application/x-cc3d"

Control WRL embedded in html using Javascript

WIDTH =598? HEIGHT =448 >

Control WRL embedded in html using Javascript

???? </ embed >

Control WRL embedded in html using Javascript

?? </ object >

Control WRL embedded in html using Javascript

< p >< a? href ="javascript:sendEvent()" ? > ?存?硅??瑰??iew1 </ a ></ p >

Control WRL embedded in html using Javascript

< p >< a? href ="javascript:original()" ? > ???㈠?板??瑙???</ a ></ p >

Control WRL embedded in html using Javascript

< p >< a? href ="javascript:stop()" ? > ??姝?</ a ></ p >

Control WRL embedded in html using Javascript

< p >< a? href ="javascript:start()" ? > 寮?濮? </ a ></ p >

Control WRL embedded in html using Javascript

< p >< a? href ="javascript:change()" ? > ?瑰??棰???</ a ></ p >

Control WRL embedded in html using Javascript

< p >< a? href ="javascript:positionshow()" > ?剧ず???? </ a ></ p >

Control WRL embedded in html using Javascript

< form? name =tickform? >

Control WRL embedded in html using Javascript

< textarea? name =tickfield?? wrap =virtual ></ textarea >

Control WRL embedded in html using Javascript

< textarea? name =tickfield_a?? wrap =virtual ></ textarea >< a? href ="javascript:positiontransmit(?)" > positiontransmit </ a >

Control WRL embedded in html using Javascript

< textarea? name =tickfield_b?? wrap =virtual ></ textarea >

Control WRL embedded in html using Javascript

</ form >

Control WRL embedded in html using Javascript

</ body >

Control WRL embedded in html using Javascript

</ html >

?

the WRL: aa.wrl

?

Control WRL embedded in html using Javascript

#VRML?V2.0?utf8

Control WRL embedded in html using Javascript

#written?by?blaxxunCC3D?5.104

Control WRL embedded in html using Javascript

DEF?view0?Viewpoint?{????

Control WRL embedded in html using Javascript

????position?0?0?10

Control WRL embedded in html using Javascript

?

Control WRL embedded in html using Javascript

????fieldOfView?1.177

Control WRL embedded in html using Javascript

????description?"view0"

Control WRL embedded in html using Javascript

}

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

DEF?view1?Viewpoint?{????

Control WRL embedded in html using Javascript

????position?11.91?1.2?65.61

Control WRL embedded in html using Javascript

????orientation?0.02942?0.8073?-0.5894?-0.05918

Control WRL embedded in html using Javascript

????fieldOfView?1.177

Control WRL embedded in html using Javascript

????description?"view1"

Control WRL embedded in html using Javascript

}

Control WRL embedded in html using Javascript

DEF?ok?Transform?{

Control WRL embedded in html using Javascript

????children?DEF?mm?Shape?{geometry??Box?{size?0.5?0.5?1}

Control WRL embedded in html using Javascript

????????appearance??Appearance?{material?DEF?blue??Material?{

Control WRL embedded in html using Javascript

????????????????diffuseColor?.10213?.70213?.70213

Control WRL embedded in html using Javascript

????????????}}}

Control WRL embedded in html using Javascript

????translation?0.151824?0?0

Control WRL embedded in html using Javascript

}

Control WRL embedded in html using Javascript

DEF????board?Transform????{translation?0?-0.9?0?children?[?Shape????{geometry?Box?

Control WRL embedded in html using Javascript

????????????{??size????10?0.2?10

Control WRL embedded in html using Javascript

????

Control WRL embedded in html using Javascript

????????????}??appearance?Appearance?{material?Material?{diffuseColor?0.5?0.4?0.2}}

Control WRL embedded in html using Javascript

????????}

Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript
Control WRL embedded in html using Javascript

????]}

Control WRL embedded in html using Javascript

DEF?clock?TimeSensor?{

Control WRL embedded in html using Javascript

????cycleInterval?5

Control WRL embedded in html using Javascript

????enabled?TRUE?

Control WRL embedded in html using Javascript

????loop?TRUE

Control WRL embedded in html using Javascript

}

Control WRL embedded in html using Javascript

DEF?position?PositionInterpolator?{

Control WRL embedded in html using Javascript

????key?[0,0.5,1]

Control WRL embedded in html using Javascript

????keyValue?[-1?0?0,1?0?0,1.2?-0.5?-1]

Control WRL embedded in html using Javascript

}

Control WRL embedded in html using Javascript

ROUTE?clock.fraction_changed?TO?position.set_fraction

Control WRL embedded in html using Javascript

ROUTE?position.value_changed?TO?ok.set_translation

Control WRL embedded in html using Javascript

?

and the running result:

Control WRL embedded in html using Javascript

Nasky

?

继续阅读