如何快速高效搭建3D场景或是快速完成三维应用？新手该如何搭建三维可视化场景？新手不会建模又该如何完成三维可视化应用？使用ThingJS，即可快速开发三维可视化应用，无论是进行园区的搭建、楼层的智能管理、工厂的数字监控、数据的控制整合、整个城市的电力监控、还是消防管理，都可以通过ThingJS快速开发。

      ThingJS是优锘科技有限公司开发的一个可视化开发平台，使用这个平台式不收费的，但是商用的话价格就得去ThingJS官方价格页面查看啦，也不贵；除此之外，ThingJS拥有“资源中心”、“在线开发”、“文档中心”、“平台与应用”、“论坛”这几个板块，当然了，这些大多是都是要登录才能查看的，像我就直接QQ登录了，登录后可以进入资源中心查看模型和场景，说实话模型有些多，官方提供的模型大多都太商业化了，我比较喜欢科通科幻的，所以有时候会下载Sketchfab网站上的可用模型，放到我的场景中去，想知道如何使用Sketchfab上的模型，可以查看我的文章《新手从零开始搭建3D场景之模型上传》，学会如何上传模型；“在线开发”的使用，就有那么一点点门槛了，如果你说你不会JavaScript，那我一点也帮不了你，建议放弃看这篇文章，当然，天赋超级好，看看注释就懂了的，那我也没得办法，本篇文章主要目的是告诉大家方法，如何去快速开发完成三维可视化应用，而不是亲手指导，若想搭建一个智慧城市的可视化应用Demo，可以查看《 使用CityBuilder搭建智慧城市3D可视化模型之创建智慧三维城市（上）》 以及《 使用CityBuilder搭建智慧城市3D可视化模型之创建智慧三维城市（下） 》

      首先需要对自己要做的项目有一个定位，是属于大型城市（智慧城市）还是属于园区场景（校园、工厂等），搭建这两个方向的可视化应用，在步骤上有一定的区别：

搭建智慧城市：

       涉及工具：

              ThingJS平台中的“CItyBuilder（免费）”、“在线开发（免费）”、ChartBuilder（免费）或是echarts；

              在线地图数据编辑器（GeoJSON、mapshaper等）；

              QGIS（处理地图数据的免费工具）；

       再次强调，这些工具不收费！！！除非最后项目完成需要商用，到时候联系ThingJS或者直接购买商业开发者即可。

      搭建步骤：

             a.使用在线地图数据编辑器（本人使用的是GeoJSON）绘制城市相关建筑，填写相关数据，推荐保存为geojson格式；

             b.使用QGIS打开保存的.geojson文件，修改属性、微调地图数据（如有数据偏移可在QGIS上进行调整）

             c.将调整好的数据上传至ThingJS平台中的CityBuilder，新建项目，选择对应区域，将数据在项目中使用，并且修改样式等；

             d.编辑CityBuilder项目，会进入到ThingJS的“在线开发”中，同时生成一个.map文件，以后要修改地图样式或者是增加场景，就能直接右键.map文件进行编辑。

             e.在“在线开发”中，使用Ctrl + B 快速打开ChartBuilder，对图表进行编辑修改以及数据对接（如何进行编辑修改请点击查看快速入门），第一次登陆会让你输入账号密码，不用输入，重新打开这个页面就好了，以后都不会再弹出提示登录的页面了，编辑完图表保存后返回到ThingJS的“在线开发”中，点击刷新按钮，刷新项目，如果发现没有出现图表，别慌，这是对的，你需要右键.cht文件，进行编辑图表和预览。

              f.最后在.js文件中编写脚本，具体可以参考官方示例中的“地球”、”拾取和选择”、“摄像机”或者其他示例。

搭建智慧园区：

       涉及工具：

              ThingJS平台中的“CamBuilder（模模搭）”、“在线开发（免费）”、ChartBuilder（免费）或是echarts；

              3dsMax（搭建特殊模型）、3dsMax 模型上传插件。

      搭建步骤：

             a.使用CamBuilder客户端搭建场景，给相关模型添加属性以便于控制；

             b.如有特殊模型，可通过3dsMax制作，或者在Sketchfab上下载免费可用的模型（注意CC版权的要求）；

             c.制作好的场景将会自动上传至ThingJS平台中，新建项目，使用Ctrl +J 快捷方式打开园区场景，双击即可使用；

             d.在“在线开发”中，使用Ctrl + B 快速打开ChartBuilder，对图表进行编辑修改以及数据对接（如何进行编辑修改请点击查看快速入门），第一次登陆会让你输入账号密码，不用输入，重新打开这个页面就好了，以后都不会再弹出提示登录的页面了，编辑完图表保存后返回到ThingJS的“在线开发”中，点击刷新按钮，刷新项目，如果发现没有出现图表，别慌，这是对的，你需要右键.cht文件，进行编辑图表和预览。

               e.最后在.js文件中编写脚本，具体可以参考官方示例中的”拾取和选择”、“摄像机”或者其他示例。

ThingJS-CityBuilder

     ThingJS专为搭建智慧城市开发了一款一键城市应用，使用CityBuilder在线工具，选择目标区域和模板，即可一键生成城市模型，同时也可以通过使用ThingJS开发的建模软件：Campusbuilder（模模搭）客户端搭建场景，将场景上传至CityBuilder中进行使用，完成模型搭建功能，最后开始编辑使用CityBuilder完成的地图项目，编辑后项目将会直接转入到ThingJS“在线开发”中去，通过拖拽快捷代码，修改相对应的名称（比如图层名字），可以说十分的方便快捷，甚至经常有，模型组人员模型还没有制作完成，开发人员已经先使用CityBuilder一键生成的粗模，将应用制作完成，只需要替换对应的模型以及地图数据即可完成整个智慧城市应用。

ThingJS-CampusBuilder

     ThingJS专为新手开发的一款简单的场景编辑器，通过使用CampusBuilder（模模搭），能够快速的搭建园区场景，在该客户端中，有着大量的模型以供选的，并且部分模型都是携带了相应动画效果、比如机柜开关门效果、人物行走打招呼效果，同样也有管线可以进行选择，无论是做数据中心、3D机房还是做管线、水利等都是十分方便快捷的，同时也可以导入CAD图纸快速生成建筑面：打开CampusBuilder客户端，选择新建，在新打开的便捷页面点击左上角的“文件”→“导入CAD”，选择对应的*.dwg文件，确认导入后编辑CAD生成的模型，并修改成理想效果，并且在CampusBuilder中，还有着场景市集可供我们查阅并且购买优秀的场景，使用现成的场景进行二次开发也能大大提高工作效率，减少开发成本。

ThingJS-ChartBuilder

     ChartBuilder 是 ThingJS 平台为商业开发者提供的图表级别搭建组件。打开已保存的项目，点击图表按钮，选择图表模板，双击即可进入ChartBuilder；编辑自己的图表内容，编辑完成后保存；回到ThingJS，点击刷新按钮。即可出现.cht文件,右键.cht文件，即可对图表进行编辑，删除，重置，以及预览添加了图表后的ThingJS项目；

ThingJS-ThingPano

        ThingPano 是基于 ThingJS 平台推出的全景工具套件，可简单高效地将高清全景图应用到 3D 环境中，实现 3D 宏观场景和全景微观场景的无缝融合，可快速调取、查看选定位置的全景图，以更加真实的环境，全视角覆盖您关注的场景。

        可以结合ThingJS原始API， 与ThingPano自身API，开发多种全景互动应用。可以实现在全景图内实景漫游的同时，在3D宏观场景中实时展示对应的空间位置。

        通过ThingPano可以轻松实现在编制可视化预案等情形下，在3D场景摆中放救援设施的同时，实时查看该设施在真实世界中的摆放效果，无需现场测量计算，精准评估预案可行性，提升工作效率。

        还可以结合 ThingJS 中的 map 功能，实现类似百度街景应用。 使用该项技术可广泛应用于房产导购、在线旅游、生产监控和安全培训等众多场合。

数据结构说明如下:

• 基础数据：

  panoID、title、correction、startH、startV 属性字段是全景图在播放器中加载浏览所需要的必要属性，用于确定一张全景图在播放器中的初始化位置与视角。

• GPS 数据：

  如果全景图中带有 GPS 定位数据，则可输出 GPS 数据用于在地图中进行定位展示。

• 热点数据：

  存储每张全景图对应的四周其他全景图的热点链接信息，用于播放器中的热点跳转。

• 场景定位数据：

  用于与 ThingJS 中的 3D 物体对象进行位置匹配与关系关联。

• 用户自定义数据：

  用于存储其他用户自定义的属性字段。

• 路径导航数据：

  用于播放器内的全景图巡路浏览。

       希望该文章能对大家有帮助，有对于ThingJS感兴趣的朋友也可以加入ThingJS官方交流群（QQ群：1057489240），或者在本论坛发帖询问。