利用JavaScript在VRML与HTML之间通信

最近常有人问JavaScript的问题,好吧,我们来看看JavaScript的实现方法吧。

这是以前VBScript中的一个例子,现在我们用JavaScript来做。
在html中比较关键的代码如下:
script language=”Javascript”
!–
function M_o(){
M_e=Scene.Engine;
M_e.Nodes(“my_Time”).Fields(“enabled”)=1;
M_x.value=M_e.Nodes(“my_view”).Fields(“translation”).x;
M_y.value=M_e.Nodes(“my_view”).Fields(“translation”).y;
M_z.value=M_e.Nodes(“my_view”).Fields(“translation”).z;
}
function M_c(){
M_e=Scene.Engine;
//新建对象M_e,它所指向的正是VRML场景Scene.
M_e.Nodes(“my_Time”).Fields(“enabled”)=0;
//将VRML场景中的”my_Time”节点的”enabled”值设为FALSE
M_x.value=M_e.Nodes(“my_view”).Fields(“translation”).x;
M_y.value=M_e.Nodes(“my_view”).Fields(“translation”).y;
M_z.value=M_e.Nodes(“my_view”).Fields(“translation”).z;
//将VRML场景中的”my_view”的x,y,z坐标值分别反馈到html页中的三个文本框中.
}
!–
/script
其中定义了两个过程M_o()和M_c(),来分别响应HTML页中按钮的点击.

以及
OBJECT id=”Scene”
CLASSID=”CLSID:86A88967-7A20-11d2-8EDA-00600818EDB1″
WIDTH=”300″
HEIGHT=”300″
PARAM NAME=”Scene” value=”kk.wrl”
/OBJECT
注意id=”Scene”不要丢了,这是给这个VRML场景取的名字.当然你也可以取成其它的名字,不过要与VBScript中的保持一致.

附录1,html代码:
html
head
script language=”Javascript”
!–
function M_o(){
M_e=Scene.Engine;
M_e.Nodes(“my_Time”).Fields(“enabled”)=1;
M_x.value=M_e.Nodes(“my_view”).Fields(“translation”).x;
M_y.value=M_e.Nodes(“my_view”).Fields(“translation”).y;
M_z.value=M_e.Nodes(“my_view”).Fields(“translation”).z;
}
function M_c(){
M_e=Scene.Engine;
M_e.Nodes(“my_Time”).Fields(“enabled”)=0;
M_x.value=M_e.Nodes(“my_view”).Fields(“translation”).x;
M_y.value=M_e.Nodes(“my_view”).Fields(“translation”).y;
M_z.value=M_e.Nodes(“my_view”).Fields(“translation”).z;
}
!–
/script
/head
body
OBJECT id=”Scene”
CLASSID=”CLSID:86A88967-7A20-11d2-8EDA-00600818EDB1″
WIDTH=”300″
HEIGHT=”300″
PARAM NAME=”Scene” value=”kk.wrl”
/OBJECT
input type=button value=”RUN” onClick=”M_o()”
input type=button value=”STOP” onClick=”M_c()”
x:y:z:/body
/html
附录2,VRML代码:
#VRML V2.0 utf8

DEF my_view Transform{
translation 1 1.2 16
rotation 0 1 0 -1
children [
DEF my_viewpoint Viewpoint {
description “AutoRun”
orientation 1 0 0 0
position 0 0 0
}
]
}
DEF old_Viewpoint Viewpoint {
description “Entry point”
orientation 0 1 0 -1
position 1 1.2 16
}
DirectionalLight {
ambientIntensity 0.8
intensity 0.6
direction 0 -1 0
}
Shape {
appearance Appearance {
material Material {
diffuseColor 1 0 0
}
}
geometry ElevationGrid {
xDimension 4
xSpacing 5.5
zDimension 4
zSpacing 5.5
height [0.8 0.1 0.4 0.5
0.5 0.4 0 0.4
0.2 0.1 0.4 0.3
0.5 0.6 0.7 0.2]
}
}
Transform {
translation 8 3.5 8
children [
Shape {
appearance Appearance {
material Material {
diffuseColor 0 0 1
}
}
geometry Box {size 1 1 1 }
}
]
}
Transform {
translation 15 0.6 15
children [
Shape {
appearance Appearance {
material Material {
diffuseColor 0 1 0
}
}
geometry Cylinder {
height 1.2
radius 0.4
}
}
]
}

DEF my_Time TimeSensor {
cycleInterval 20
enabled FALSE
loop TRUE
}
DEF my_Position PositionInterpolator {
key [0 0.25 0.38 0.5 0.75 1.0]
keyValue [1 1.2 16,2 1.2 1,7 1.2 1,
15 1.2 1,14 1.2 12,1 1.2 16]
}
DEF my_Direction orientationInterpolator {
key[0 0.25 0.38 0.5 0.75 1.0]
keyValue [0 1 0 -1,0 1 0 -2.9,0 1 0 3.14,
0 1 0 2.9,0 1 0 1.4,0 1 0 -1]
}
DEF my_LookUpAngle orientationInterpolator {
key [ 0 0.25 0.38 0.5 0.75 1.0]
keyValue [1 0 0 0,1 0 0 0,1 0 0 0.3,
1 0 0 0,1 0 0 0,1 0 0 0]
}
ROUTE my_viewpoint.bindTime TO my_Time.set_startTime
ROUTE my_viewpoint.isBound TO my_Time.set_enabled

ROUTE my_Time.fraction_changed TO my_Position.set_fraction
ROUTE my_Time.fraction_changed TO my_Direction.set_fraction
ROUTE my_Time.fraction_changed TO my_LookUpAngle.set_fraction

ROUTE my_Position.value_changed TO my_view.set_translation
ROUTE my_Direction.value_changed TO my_view.set_rotation
ROUTE my_LookUpAngle.value_changed TO my_viewpoint.set_orientation

*因显示问题,将HTML语言的<和>全部除去

发布于 :未分类

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注