分享
查看: 2407|回复: 0

[分享] webgl可视化平台ThingJS之核心对象App介绍

[复制链接]

webgl可视化平台ThingJS之核心对象App介绍

发表于 2019-11-21 15:42:18 来自 分享 阅读模式 倒序浏览
zzv_icon2407 zzr_icon0 查看全部

对于目前市场来看,3D可视化正在冉冉升起,各种3D方面的第三方库也是应运而生,其中threejs作为目前十分火热的一个第三方js库,同时也有着十分完善的教程,唯一美中不足的就是入门不易,ThingJS作为一个webgl可视化平台,通过封装Threejs,制作了一款适合商业开发者使用的第三方库thingjs,将部分难以实现的操作直接内置了,也因此,大约一个月就能入门使用的threejs,在ThingJS平台中,一个星期就能够入门,并且能够着手开发出一个3D可视化项目,在ThingJS网站中也可以通过“资源中心”查看用户的公开项目(https://store.thingjs.com/?t=projects)。


使用thingjs需要了解什么?

第一:了解thingjs的核心对象-App;

第二:学会摄像机camera;

第三:学会控制对象;

第四:了解或者学会图表的使用;

第五:了解或者学会数据对接;

第六:学会如何发布项目;


什么是thingjs的核心对象App?

App对象是ThingJS 库的入口,提供加载场景、搜索、事件绑定、摄像机控制等功能,一般而言,创建App对象的代码会在代码第一行书写,同时App对象还有四个属性:

url:初始场景资源路径,这个场景必须是在ThingJS平台中存在的(使用CamBuilder或者CityBuilder搭建的场景进行开发时都会生成场景资源路径);
skyBox:天空盒资源名称,目前有BulBlueSky(蓝天)、MilkyWay(银河)、Night(黑夜)、CloudSky(多云)、White(灰白)、Dark(暗黑);
background:设置场景的背景颜色或图片;
complete:场景资源初始化完成后的函数回调;
  1. // 仅初始化 3D 应用
  2. var app=new THING.App();
  3. // 初始化 3D 应用,并加载场景
  4. var app = new THING.App({
  5. url: 'https://www.thingjs.com/static/models/storehouse'// 场景地址
  6. });
  7. // 设置天空盒
  8. var app = new THING.App({
  9. url: 'https://www.thingjs.com/static/models/storehouse',// 场景地址
  10. skyBox:'BlueSky'
  11. });
  12. // 设置背景图片
  13. var app = new THING.App({
  14. url: 'https://www.thingjs.com/static/models/storehouse',// 场景地址
  15. background: 'http://www.thingjs.com/static/images/background_img_03.png'
  16. });
复制代码


avatar
游客~
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

130700ppkpl8x3t7tt1b1t