在前面实验操作中，toString()，我们已经用blender将模型和场景整合好，equals()，并添加了若干摄像机对象；然后用Photoshop和 Dreamwaver设计好界面；本次实验就要用三维引擎将二维界面和三维场景结合起来，hashcode()。这一次，并添加逻辑命令，我们来重点讲解 wait()，从而能够操纵三维场景中的各种模型对象。按照惯例，notify()，在实验操作之前，notifyAll() 这方法。含参数的wait()方法调用以后，我们先补一下相关理论知识。
一、三维图形引擎简介：
三维图形引擎是虚拟现实的基础技术，线程可以在等待时间结束后被唤醒；无参的wait()方法调用后，它的核心功能在于对三维图形进行渲染。三维引擎本质上是一种虚拟仿真程序工具包，则必须等待持有该对象监视器的线程主动调用notify()或notifyAll()方法后才能被唤醒。两者之间的区别，利用它可以迅速搭建三维虚拟仿真程序的雏形。电子游戏是三维引擎发展的重要领域，在于notify()方法唤醒在此对象监视器上等待的单个线程，不过随着技术的不断进步，而notifyAll()方法则唤醒在此对象监视器上等待的所有线程。与wait方法一样，在军事训练、安全模拟、旅游、航空航天等等方面都有了三维引擎的身影。在法学实务中，近年兴起的VR示证、犯罪现场三维重建等工作更是离不开三维引擎的助力。
早期三维引擎的发展离不开电子游戏，所以早期的三维引擎都是以游戏的名字来命名。如1990年的"太空指挥官”引擎，是最早的一款三维图形引擎；1995年的Quake雷神之锤引擎，用更加精湛的表现，预示了三维引擎走向成熟。目前，越来越多的三维引擎把虚拟仿真技术推向一个又一个的高峰，而且专业门槛也在不断降低，这使得非计算机专业人士虚仿程序成为可能。
目前三维引擎有很多类型，既有商用的如Unity3d、UE4，又有开源的如：Gadot、three.js、babylon.js等；有单机版的，也有在线版的。近年来，国内也有不少优秀引擎涌现，如以前提到过的中视典VRP、以及白鹭引擎、ideavr引擎、layabox引擎等等,这些产品都为目前国内高校的虚仿课程提供了很好的支持。
本次实验我们采用blender+verge3d流程，打造在线交互的虚仿模拟现场。
按照其官网的介绍，Verge3D是一个功能强且直观的工具包，它允许Blender， 3ds Max或Maya艺术家创建基于Web 沉浸式的的体验。它是俄罗斯的一款商业虚拟引擎，提供免费的学版本用于熟悉软件功能，如果要发布商用程序则需要购买正式版。Verge3D可以无缝地与blender、3ds Max和Maya配合，应用简单的拼图式编程方法，就可以为程序界面和场景设计各种交互，降低了虚仿程序设计的门槛。接下来我们就用verge3d的Blender版，来为前面专题所设计的界面和场景添加交互逻辑。
二、Verge3d插件安装与环境搭建：
(一)安装软件和插件：
在官网上下载Verge3D，双击并安装。然后在blender软件偏好设置的插件l栏中，搜索Verge3d并勾选（见图一），在Blender中的主界面右上角会出现Sneek Peek和App Manager两个按钮，这样环境就搭建好了（见图二）。
图一 勾选插件
图二 插件安装好后的状态
（二）了解工程文件结构：
图三 Verge3d 项目管理界面
图四 Verge3d 项目文件管理
（三）导出场景文件和引入界面文件：
现在需要将blender场景工程文件，即scene.blend复制到项目文件夹，并用blender打开。然后在文件-->导出中选择verge3d gbtl格式，生成scene.gbtl（见图五）。接着在前文所做的界面文件index.html中，在合适的位置插入iframe,指定其样式，然后所有工程文件都存入verge3d项目文件夹，在iframe中链接指向scene.html（见图六），保存后就可以进入交互设计阶段了。
图五 导出gblt场景文件
图六 在Dreamwaver中加入Iframe控件
相关代码如下：
其中class为类名，表明iframe适用"Div3“一类控件的样式规格，ID为其特有的唯一性标识，src则指向已经导出好了的html文件。这样再另存为Gui.html,就可以了。
（四）整理项目资产：
在后面的编程中，要准确操作某个对象，就必须做到对其能够正确快捷地进行引用，这就需要整理项目资产，即为按钮这样的二维界面元素以及场景模型、相机等三维对象进行唯一性命名，最好能够从名称上就能识别出该对象。不需要交互的分，能合并就合并，减少对象数量，这样能使对象引用更加便捷。
三、拼图式交互设计：
通常在进行交互设计时需要用到各种编程语言，如c#、c++、lua、JavaScript等等；但在verge3d中，它却采用了一种图形化拼图编程的方式，让程序结构变得可视化，容易让非程序员理解并掌握。
在项目管理页面中，在相应项目上点击右方图标，就可以进入拼图编程界面。在交互设计中能够用到的基本命令，都可以在左侧命令栏中直接拖动（见图七）。本次实验我们专挑个别命令模块进行讲解，更详细教程留待以后陆续推出。
图七 拼图式编程界面
首先我们要明确一下我们的资产库里面有哪些可交互对象？其交互的主要动作或方式是什么？交互动作完成后实现的效果是什么？
（一）对象选择：
对于第一个问题，本案例的交互对象包括界面文件中的各种按钮，以及三维场景中的模型和相机。在拼图中，对象的指定主要由选择器（Selector）拼图和文本（Text）拼图来完成。如对于模型的选择通常用以下拼图：
这表示选择或指定了一把椅子，其模型名为"chair_chair_TEXTILE_generic_398"。点击此选择器的内容，就会出现所有可选择模型对象的名称，点击名称就可以将其指定。再比如：
则是选定了名为 "TopCamera"的相机。
如果是二维界面的按钮等控件，那么就要用文本选择拼图，其内容为按钮控件的ID名称，需要手动输入。如：
就是选定的ID名称为“Button1”的按钮。
（二）添加事件：
对于第二个问题，本案例交互的主要方式是鼠标点击，当然也可以设置键盘控制，以后还可以加入游戏手柄、体感控制器、VR控制器等交互方式。那么就可以在事件（Events）一类拼图中进行设置。通常选择的拼图为：
意思就是当在某模型对象上点击时，就要进行某种效果显示。而效果显示又是对象组（Object）的作用域，里面有许多可以控制对象动作的拼图。
此为显示某个对象；
此为隐藏某个对象。
那么，如果将它们组合起来，则是：
其意思是当对iBook的键盘进行点击时，椅子“chair_chair_TEXTILE_generic_398"就会隐藏。如果要重新显示，则要点击另一处对象，如下所示：
点击iBook底，椅子就会重新显示。
不过，如果是对按钮来说，点击事件需要由HTML拼图来设置，通常要找到如下拼图：
那么通过按钮来控制模型对象的显示隐藏就可以按如下方式设计。
即当点击“Button1”时，椅子隐藏；当点击“Button2”时，椅子重新显示。类似地，我们不仅可以用这样的拼图来控制物体的平移、旋转和缩放等动态效果，还可以控制相机，让场景在不同机位上切换。
（三）优化算法：
1.逻辑（Logic）拼图：
为了让某些效果更合理，在编程时还可能用到以下逻辑（Logic）拼图：
意思就是当满足某些条件的时候，就要执行某种事件。在此拼图左上角的选择项中可以添加任意数量的条件。
当然，要想实现更多功能还必须了解如何创设变量和函数。
2.变量（Veriable）拼图
首先通过点击“创设变量（Create Veriable）”为新变量命名。然后就会出现若干与变量有关的拼图。比如我们创设了一个名为“anctionStep”的变量，那么就会得到一个变量模块：以及两个赋值语句模块：和。前者是赋予变量一个初始值，后者是改变变量的值。为此变量赋值一般会用到各种运算符，比如以下语句：
即将变量“actionIndex”赋值为0,相当于：actionStep=0
相当于：actionStep=actionIndex+4
3.程序（Procedure）拼图
本质上是创建执行某种动作的函数，在拼图中充当某种功能模块。只要定义了一个程序拼图，那么就会使某对象或控件具备一种自定义的功能，可以在不同场合下重复使用。其基本构造为：
在其左上角选项可以设置任意数量的参数。构造出此函数以后，就会创造出一个程序模块，可以在其他位置复用：
如果需要此拼图具有返回值，则可选择：
构造出函数以后，就可以在其他场合以下面的方式为其他变量进行赋值：
4. 图形编程案例：
下面我们通过一个简单的案例，来将前述拼图调动起来，以此来体验图形编程的过程。我们拟设计一个具有平面、立方体、圆锥体和棱角球体的场景，并且在不同方向上设置了四个相机。在图形界面，想设置两个按钮，一个名为“上一个”，另一个名为“下一个”。点击“下一个”，相机视图就会以一定顺序依次呈现；点击“上一个”，相机视图就会以反方向依次呈现。界面设计如图所示：
图八 演示程序界面
我们要设计两个数值变量来代表相机的顺位。一个是“actionIndex”，一个是“actionStep"。
其中“actionIndex”取值1、2、3、4，代表第一、二、三、四正向机位排序。“actionStep”取值4、3、2、1，代表第四、三、二、一逆序的机位排序。
每按一次“下一个”按钮，“actionIndex"就会加1，机位就会切换到下一个。超过4以后，会强行将其赋值为1，重新计数，这样其值才不会超过相机个数。
“上一个”按钮，则是先将“actionStep"设置为“actionIndex+4”，然后没按一次，“actionStep”就减1，如果减为0，则会强行将其变为“actionIndex+4”，重新技术。
有一个难点，就是两个变量都是数值型，但相机排位其实是文本型，这涉及到一个数值型与文本型转换的问题，需要运用到以下拼图：
意思就是将“actionIndex”的数值转换为文本。
此案例完整拼图如下，试逐行理解并实操演练：
(四)、程序发布：
在Verge3D中点击图标，可以选择发布方式。如果有一个服务器，将工程文件夹里的文件都上传下去，那么就会得到一个在线程序。
如果点击图标，则会发布为单机或手机版。发布后，我们就可以清楚地看到效果了。
这个小案例其实就是为今后制作虚仿课件搭建的一个框架，通过点击上一个、下一个按钮，实现各个机位的切换，如果能配合一些讲解与注释，就可以实现丰富的演示功能。
以上就是Blender和Verge3d进行虚拟互动场景建模的基础知识，下个专题我们会应用更多的拼图来创建一个比较完善的虚拟互动现场。
文章由证据科学技术原创
如要转载，请联系作者
欢迎留言评论指正
免责声明：文中图片均来源于网络，如有版权问题请联系我们进行删除！
