#三维可视化##3D开发#
ThingJS编辑界面布局3D建模与场景搭建方法交互控制脚本开发关键点
ThingJS平台基于WebGL中的3D框架进行3D开发，界面设计采用HTML5，系统脚本采用JavaScript。完整的平台系统包含七大模块：3D场景搭建、模型操作、模型导入、模型导出、场景渲染、压缩与解压、信息存储与显示。
各模块独立又紧密联系，核心的核心主要是3D建模与场景搭建、交互控制开发，ThingJS本着加速3D项目开发的原则，做了间接的封装，拥有自己的平台特色。
平台只有一个主界面，分为三个区域：在线开发工具栏、3D编辑器及3D场景渲染区域。场景渲染区域为用于实时渲染整个场景的3D数据，同时用户也可以在这上面进行鼠标交互操作，例如缩放、旋转、平移等；在线开发工具栏区域提供官方示例及用户创建并保存的项目；3D编辑器区域展示了打开的项目或文件的内容，包含对象列表、几何信息、材质信息等，同时，用户可以通过编辑修改这些信息来改变对象的材质或属性等。
3D场景所需要的基本要素包括渲染器、场景、相机、灯光、物体，ThingJS3D引擎都已经封装成js库，不需要再造轮子，当然，缺少其中某一样都不能构成一个完整的3D场景。
下面就来谈谈3D场景创建、脚本开发构建的过程，分成3D建模、交互控制两部分。
1.3D建模与场景搭建
渲染方式ThingJS平台提供两种渲染方式，即WebGLRenderer及CanvasRenderer。两者的渲染比较，从图中可以看出WebGLRendere的3D渲染效果更真实生动，可以充分表现场景的细节与材质特性，但它对硬件性能和显卡有要求。相反地，CanvasRenderer则具有更好的兼容性，且没有锯齿，能够适用于更多的设备。
很显然，如果你的设备支持WebGL，那么WebGLRenderer渲染器具有比CanvasRenderer更好的性能。ThingJS支持用Canvas进行2D面板内的贴图绘制。在合理范围内选择高效率、低成本的实现方案，这是平台宗旨。
基础几何体有了场景，我们就可以添加物体对象了。ThingJS3D引擎提供多种基础几何体对象，供用户选择创建于场景中，包括平面、圆形、立方体、圆柱体、球体、多面体等，如图所示。直接JavaScript调用代码创建，用户可以通过修改其参数来改变几何体的形状，物体参数可分为通用参数、特定物体类型（type）的专属参数、系统其他功能。列表如下：
（1）通用参数
type：该物体用什么物体类来创建
id：该物体的编号
name：物体的名字
position：设置世界位置
localPosition：设置在父物体下的相对位置，和position只能输入一个
angles：设置世界坐标系下三轴旋转角度，例如：angles:[90,45,90]，代表在世界坐标系下物体沿X轴旋转90度,沿Y轴旋转45度,沿Z轴旋转90度
scale：设置相对自身坐标系下的缩放比例
parent：设置父物体是谁
（2）特定物体类型（type）的专属参数
url：物体模型资源路径，这个是“Thing”物体需要的参数
（3）系统其他功能