1 / 38

X3D 教程

X3D 教程. 掌握 X3D 第六节. 主要内容：交互. 掌握 X3D 第六节. LOD 细节级别. LOD 此节点会根据视点到物体的距离做出不同的事件，例如根据不同的距离显示不同的图形。 range 层次范围. 视点. range. 掌握 X3D 第六节. <LOD range="15"> <Shape> <Box/> </Shape> <Shape> <Text string="hello"/> </Shape> </LOD>. 视点.

talmai
Télécharger la présentation

X3D 教程

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. X3D教程

  2. 掌握X3D 第六节 主要内容：交互

  3. 掌握X3D 第六节 LOD细节级别 • LOD此节点会根据视点到物体的距离做出不同的事件，例如根据不同的距离显示不同的图形。 • range 层次范围 视点 range

  4. 掌握X3D 第六节 • <LOD range="15"> • <Shape> • <Box/> • </Shape> • <Shape> • <Text string="hello"/> • </Shape> • </LOD> 视点 Range 15

  5. 掌握X3D 第六节 • <LOD range="15 30"> • <Shape> • <Box/> • </Shape> • <Shape> • <Text string="hello"/> • </Shape> • <Shape> • <Cone /> • </Shape> • </LOD>

  6. 掌握X3D 第六节 Collision碰撞 • Collision当视点与物体发生碰撞时发生事件 • collideTime 发生碰撞的时间事件 视点

  7. 掌握X3D 第六节 • <Collision DEF='C' enabled='true'> • <Transform DEF='Mover' translation='0 1 0'> • <Shape> • <Appearance> • <ImageTexture url="2.jpg" /> • </Appearance> • <Sphere radius='0.2'/> • </Shape> • </Transform> • </Collision>

  8. 掌握X3D 第六节 • <TimeSensor DEF='Clock' cycleInterval='8' /> • 使起初不会转？ • 记得以前的TimeSensor？ • <TimeSensor DEF='Clock' cycleInterval='8' loop='true' /> • 通过set_startTime启动TimeSensor

  9. 掌握X3D 第六节 • <OrientationInterpolator DEF='Or' key='0, 0.5, 1' keyValue='0 1 0 0.0, 0 1 0 3.14, 0 1 0 6.28'/>

  10. 掌握X3D 第六节 • <ROUTE fromNode='C' fromField='collideTime' toNode='Clock' toField='set_startTime'/> • <ROUTE fromNode='Clock' fromField='fraction_changed' toNode='Or' toField='set_fraction'/> • <ROUTE fromNode='Or' fromField='value_changed' toNode='Mover' toField='set_rotation'/>

  11. 掌握X3D 第六节 Anchor超链接 • description 描述 • url 地址

  12. 掌握X3D 第六节 链接到网页 • <Anchor description="baidu.com" url="http://www.baidu.com"> • <Shape> • <Text string="baidu"/> • </Shape> • </Anchor> • 保存为1.X3D

  13. 掌握X3D 第六节 链接到X3D文件 • <Anchor url="1.x3d"> • <Shape> • <Appearance> • <Material diffuseColor="1 0 0" emissiveColor="0 1 0" specularColor="0 0 1"/> • </Appearance> • <Box size="1 1 1"/> • </Shape> • </Anchor>

  14. 掌握X3D 第六节 Touch接触 • TouchSensor接触感应 • isActive 鼠标按下时为true • isOver 鼠标划过时发生事件 • touchTime鼠标按下时发生时间事件

  15. 掌握X3D 第六节 交互流程 ROUTE ROUTE TouchSensor Script text

  16. 掌握X3D 第六节 改变文字 • <Shape> • <Text DEF="text" string="hello"/> • </Shape> • <TouchSensor DEF="touchSensor"/>

  17. 掌握X3D 第六节 • <Script DEF="Script"> • <field name="set_active" type="SFBool" accessType="inputOnly" /> • <field name="string_changed" type="MFString" accessType="outputOnly" /> • <![CDATA[javascript: • function set_active() • { • string_changed = "touch"; • }]]> • </Script>

  18. 掌握X3D 第六节 • <ROUTE fromNode="touchSensor" fromField="isActive" toNode="Script" toField="set_active" /> • <ROUTE fromNode="Script" fromField="string_changed" toNode="text" toField="string" />

  19. 掌握X3D 第六节 • 划过便触发 • <ROUTE fromNode="touchSensor" fromField="isOver" toNode="Script" toField="set_active" /> • <ROUTE fromNode="Script" fromField="string_changed" toNode="text" toField="string" />

  20. 掌握X3D 第六节 左右移动 • 按钮 TouchSensor放在中间表示只对某个物体有效 • <Transform translation="-2 -2 0"> • <TouchSensor DEF="touchSensor1"/> • <Shape> • <Text string="Left"/> • </Shape> • </Transform> • <Transform translation="2 -2 0"> • <TouchSensor DEF="touchSensor2"/> • <Shape> • <Text string="Right"/> • </Shape> • </Transform>

  21. 掌握X3D 第六节 • 移动体 • <Transform DEF="M" > • <Shape> • <Appearance> • <ImageTexture url="2.jpg"/> • </Appearance> • <Box/> • </Shape> • </Transform>

  22. 掌握X3D 第六节 • <Script DEF="Script"> • <field name="set_fraction1" type="SFBool" accessType="inputOnly" /> • <field name="set_fraction2" type="SFBool" accessType="inputOnly" /> • <field name="value_changed" type="SFVec3f" accessType="outputOnly" />

  23. 掌握X3D 第六节 • <![CDATA[javascript: • function set_fraction1() • { • value_changed[0]-=0.2; • } • function set_fraction2() • { • value_changed[0]+=0.2; • } • ]]> • </Script>

  24. 掌握X3D 第六节 • <ROUTE fromNode="touchSensor1" fromField="isActive" toNode="Script" toField="set_fraction1" /> • <ROUTE fromNode="touchSensor2" fromField="isActive" toNode="Script" toField="set_fraction2" /> • <ROUTE fromNode="Script" fromField="value_changed" toNode="M" toField="translation" />

  25. 掌握X3D 第六节 陨石游戏 • 点击发生变化 • <Transform DEF="transform"> • <Shape> • <Appearance> • <ImageTexture url="3.jpg" /> • </Appearance> • <Sphere radius="1" /> • </Shape> • </Transform> • <TouchSensor DEF="touchSensor"/>

  26. 掌握X3D 第六节 • <Script DEF="Script"> • <field name="set_fraction" type="SFBool" accessType="inputOnly" /> • <field name="value_changed" type="SFVec3f" accessType="outputOnly" /> • <![CDATA[javascript: • function set_fraction() • { • value_changed[2] -= 10; • }]]> • </Script>

  27. 掌握X3D 第六节 • <ROUTE fromNode="touchSensor" fromField="isActive" toNode="Script" toField="set_fraction" /> • <ROUTE fromNode="Script" fromField="value_changed" toNode="transform" toField="translation" /> ROUTE ROUTE

  28. 掌握X3D 第六节 计分 • <Transform translation="-2 2 0"> • <Shape> • <Text DEF="text"/> • </Shape> • </Transform> • <TimeSensor DEF="Clock" cycleInterval="4" loop="true"/>

  29. 掌握X3D 第六节 添加成员 • <Script DEF="Script"> • <field name="set_fraction" type="SFBool" accessType="inputOnly" /> • <field name='set_fraction2' type='SFFloat' accessType='inputOnly'/> • <field name="value_changed" type="SFVec3f" accessType="outputOnly" /> • <field name="string_changed" type="MFString" accessType="outputOnly" value="scores:0"/> • <field name="scores" type="SFInt32" accessType="outputOnly" value="0"/>

  30. 掌握X3D 第六节 • function set_fraction() • { • value_changed[2] -= 10; • scores+=10; • }

  31. 掌握X3D 第六节 • function set_fraction2() • { • string_changed="scores:"+scores; • }

  32. 掌握X3D 第六节 • <ROUTE fromNode="Clock" fromField="fraction_changed" toNode="Script" toField="set_fraction2" /> • <ROUTE fromNode="Script" fromField="string_changed" toNode="text" toField="string" /> ROUTE ROUTE

  33. 掌握X3D 第六节 陨石会移动 • 时间 • <TimeSensor DEF="Clock2" cycleInterval="4" loop="true"/> • 成员 • <field name='set_fraction3' type='SFFloat' accessType='inputOnly'/> • <field name="t" type="SFFloat" accessType="outputOnly" />

  34. 掌握X3D 第六节 • 圆周运动 • function set_fraction3() { • t+=0.1; • value_changed[0] =2*Math.sin(t); • value_changed[1] =2*Math.cos(t); • } • 传递 • <ROUTE fromNode="Clock2" fromField="fraction_changed" toNode="Script" toField="set_fraction3" />

  35. 掌握X3D 第六节 点文字也可以？移动位置 • <Transform DEF="transform"> • <TouchSensor DEF="touchSensor"/> • <Shape> • <Appearance> • <ImageTexture url="3.jpg" /> • </Appearance> • <Sphere radius="1" /> • </Shape> • </Transform>

  36. 掌握X3D 第六节 • 改进:多个球，复杂的移动路径

More Related