ThingJS,像孩子搭乐高一样去开发3D商业项目!

解密ThingJS是如何让程序员更高效的开发物联网可视化项目 物联网可视化项目怎么制作的?除了需要建模还需要什么?一般来说物联网可视化项目中都包含哪些东西?物联网可视化项目的制作周期大概是多久?一个用来初期投标的物联网可视化方案怎么制作才算是简单?就目前而言,可视化运用的最为广泛的位置是哪?游戏领域可以说是可视化运用的最为广泛的位置,比如《刺客信条》《荒野大镖客》等等,可以说,绝大多数3d游戏,都运用到了可视化的技术,除此之外就是影视行业了,一些特效的制作同... 阅读详情

ThingJS是一个基于JS代码进行开发的PAAS平台,通过轻量化的官方示例,快速上手3D可视化,只要懂得JS的设计师或者开发人员,都能够在短时间内有不错的开发成果。

启动平台之后,第一步该是创建对象APP,以便承载后期的3D功能开发。

ThingJS启动后创建核心对象APP

ThingJS的核心对象APP创建方法如下:

1	var app = new THING.App();
加载园区场景

这个是核心对象的创建方法,具体还有加载园区的方式,通过URL的方式将园区加载至ThingJS中:

var app = new THING.App({
    url: "models/storehouse"
});

其中的URL则是我们的场景地址,此处为选填,该地址可写绝对路径也可写相对路径。有人可能会疑惑这个地址怎么来的?只需要通过Ctrl + J 这个快捷键或者直接点击园区按钮,双击即可自动生成核心对象APP以及相关URL,图示如下:
在这里插入图片描述

当然也可以不输入路径,在你需要的时候通过 app.create创建园区物体,从而加载园区,代码示例如下:

var app = new THING.App();
var obj = app.create({
    type: "Campus",
    url: "models/storehouse/",
    complete: function() {
    console.log("Campus created: " + this.id);
    }
});
加载地球场景

ThingJS 3D开发如何实现进出层级?超简单! 作为开发真的不容易,要不就偷懒一下吧~偷懒也有好处,利用轻量化工具能节省很多时间,让你做出傲人的商业3D可视化项目效果! 好的开始是成功的一半。只要你拥有了JavaScript基础,同时也了解如何使用上传后的资源,我们就可以开始通过ThingJS在线开发平台制作我们的第一个“HelloWorld”项目了。不了解如何操作的,可以点击 学习如何上传js/css/图片等资源到ThingJSThingJS项目初制作 在ThingJS开发中,最重要的就是我们的APP对象了,有关ThingJS App对象介绍,大家 阅读详情

相关推荐

3D商业项目难,ThingJS PAAS 降低开发门槛

有没有一个开发软件,不仅直接注册、看到代码运行结果,还提供相当丰富的官方示例,以很简单的授权服务,帮助用户建场景、开发3D功能并对接到物联网设备之后,再进行在线或离线部署工作,如果基于这整套工作流,开发3D商业项目可就简单轻松多了! 为了满足不同的项目场景需求,往往会使用不同的技术和相应的框架开发,与金融相关的则会有一套或者是多套自主研发的框架以供内部人员使用。与平台系统相关的,大多也会有许多封装好的接口以供使用,这些相比于还需要从头开始写的那些项目ThingJS不但在技术上进行了简化,更是在时间上进

ThingJS的博客 442

lego-editor:乐高H5编辑器是一个灵活,强大,低心智成本的H5页面编辑器

乐高H5编辑器(在制品警告) 开发环境 cnpm install cnpm run serve 项目结构 段:页面逻辑结构细分。整个编辑器划分为导航标题,标题模块,预览面板,屏幕(或画布),右侧编辑面板结构,分别对应标题,左面板,屏幕,右面板这四个子文件夹。 形式:右侧编辑面板区域使用到的动态表单(及规范)。 modules:模块文件,每一个文件夹对应一个模块(TODO index.js会自动导出所有模块)。 型号:开发乐高H5的模块需要遵守的约定。module.js,props.js,分别对模块运行时数据和模块编写规范作约定。 乐高H5与常见的开源页面编辑器的最大的不同是,乐高H5使用开发约定而不是数据结构约定(JSON),这可以减少心智成本,减少编写模块以及调试时的复杂度。 需要协助 如果有任何想法,欢迎发行以及PR〜

ThingJS 和three.js对比开发太空漫游技术!3D 可视化

ThingJS 3D用来增加视觉效果,给人以更加直观,真实的感觉。 ThingJS 3D框架简化了开发工作,面向对象和模块化的特点使得网页代码更加易于管理和维护,并且提供近200个官方示例,直接获取API能力,不需要基于3D概念进行开发,适合3D商业项目快速生成!距离您的业务仅一层之隔,是非开发者也容易理解的一种应用方法。 Three.js是更为底层的3D渲染器,提供各式各样的3D开发概念,例如材质、网格、shader、灯光,逐一进行定制化开发,要求程序员要有清晰的设计思路,尤其是在3D对象类的定义上。

ThingJS的博客 3441

ThingJS如何收费的?

作为商用平台,使用ThingJS是需要收费的,这个是重点,要是使用ThingJS项目,钱也花了,项目都制作不出来,岂不是亏大了?那就不得不向大家介绍一下ThingJS了。 ThingJS如何收费的? 第一点:ThingJS的软件不像IDEA或者AE这种,你需要花钱购买才能使用的,在线工具有CityBuilder、ChartBuilder,在线开发平台,其他客户端有CampusBuilder(模模)客户端,外立面编辑器,以及模型上传插件,这些都是免费使用的,至于有人反馈说里面还有付费功能,客户端里面当然

TTianYe的博客 6870

ThingJS 开发使用感悟

ThingJS 隶属于北京优锘科技有限公司,是优锘科技旗下物联网三维可视化开发平台。ThingJS采用JavaScript开发语言,主要面向前端程序员和实施人员。ThingJS平台让传统企业无需组建3D可视化开发团队,也能开发3D可视化应用。以上解释来自百度百科,我相信应该是由其官方人员编写的。简单的说,ThingJS 是由国人开发的(北京优锘),需要付费使用的,基于ThreeJS封装的一个 3d 可视化开发平台。.....................

似水流年的博客 8564

新产品发现-ThingJS一个手工建在线Web三维3D网站

最近发现了一个新产品,叫ThingJS,云端建Web三维应用的,看调用方法基本属于js语法,但是各种限制较为死,目测他们主要在做和卖解决方案为主,我这样的C端散客也大都是看看游览一下。 自己新建了一个demo项目,在演示项目的基础上加了一点小小的粒子特效: 最后补充: 缺陷:Thingjs不免费,且价格较高,单应用发布按照年计费,一年一个APP2888元 我也是在看完HelloWorld项目之后,因为价格被劝退 ...

Stephanie的专栏 1177

ThingJS项目开发流程

黄粱一梦 2474

threejs制作项目怎么样?ThingJS收费吗?

使用ThingJS收费吗?ThingJS是怎么收费的呢?ThingJS官网上的价格页面中VIP(商业开发者)和商业开发者(离线SDK包)有什么区别吗?使用ThingJS能制作一个智慧园区可视化项目或者是智慧城市可视化项目吗?使用ThingJS大概要花多少钱? 这些想必是一些打算开始制作物联网三维可视化项目的人的一些问题了,有的人会问,木棉树怎么样?图扑怎么样?其他的物联网可视化平台又怎么样?甚至还...

qq_42739428的博客 5273

结合Echarts、Ajax技术实现可视化大屏监控 ThingJS 3d 开发

#三维可视化# #3D开发# ECharts是 Enterprise Charts缩写,表示商业级数据表图,它是一个基于html5 Canvas的图标库,可以流畅的运行在PC和移动设备上,兼容当前绝大部分浏览器 (E6/7/8/9/10/1, chrome, firefox, Sarari等),底层依赖轻量级的 Canvas类库 ZRender,创建了坐标系、图例、提示、工具箱等基础组件,能够提供直观、生动、可交互、可高度个性化定制的数据可视化图表。创新的拖拽计算、数据视图、值域漫游等特性大大增强了用户体验

ThingJS的博客 1850

仅需30分钟,学会制作阿里云IOT的3D可视化项目

ThingJS和阿里云物联网合作推出在线的空间数据可视化开发,仅4个步骤就可以完成一个3D商业展示场景。 阿里云物联网和ThingJS达成合作,推出空间可视化数据分析,从2D扩展到了3D界面,常见的有智慧园区3D场景,和平面图最大的区别在于,我们可以进入建筑内或物体中,设置多个层级,找到更多人与物、物与物之间的联系。 作为3D开发人员,或者一个物联网项目的主理人,这一套3D开发流程对你有什么帮助?1、可以进行物联网项目演示,2、可以激活并控制设备。当然,想让传感器的电子数据传输至接收的设备,就需要更多IoT

ThingJS的博客 2260

安全管理可视化:ThingJS 3D人员定位技术如何实现?

现在我们开始利用室内室外结合的定位技术,了解危险作业区域内工作人员的动态和活动轨迹,传输过来的实时数据可以进行跟踪分析和精准定位,如今展示界面2D平面开始逐渐由3D取代,安全管理可视化更加立体了,具体是如何实现的呢?这个和传统的人员位置展现有什么不同呢? 通过ThingJS可以将人员的定位信息在3D场景中对应起来,进行描点,画线,并创建相关人物的模型,根据实时数据驱动人物行走,并且支持楼层内外的相结合,使我们能更加直观的了解人物所处位置及行走路线。 人物户外行走 方案:根据最新请求的位置数据与上一次请求所得

ThingJS的博客 2019

ThingJS:次时代3D城市大屏,2款工具3分钟建完成!

次时代3D数据大屏最近特别火?通过ThingJS CityBuilder+DataV在线工具,学会快速制作可视化大屏。 还在制作上图这种千篇一律的数据大屏?OUT啦!酷炫的3D次世代数据大屏帮你一秒俘获甲方爸爸的芳心! 本图片来自ThingJS用户 云南唯恒基业科技有限公司 今天就来教大家三维数据大屏! 为了方便演示,我们来制作一个简单的三维城市与传统二维图表相结合的大屏,相信大家学习之后都能做出酷炫的三维大屏! 先来看看结果: 所需工具 • ThingJS平台:面向互联网的3D可视化开发平台 • C

ThingJS的博客 999

多个物体模型快速制作爆炸图?试一试ThingJS

爆炸图,其实是一个外来词汇,英文的名称是Exploded Views。在日常生活中,购买的各种各样的日常生活用品的使用说明书上都有装配示意图,它是图解说明各构件的。可以说这个具有立体感的分解说明图就是个最简单的爆炸图。具体点说是轴测装配示意图。同时国家标准也作了相应规定,要求工业产品的使用说明书中的产品结构优先采用立体图示。可以说爆炸图就是立体装配图。 ​爆炸图是当今的三维CAD、CAM软件中的一项重要功能。有了这个相应的操作功能选项,工程技术人员在绘制立体装配示意图时就显得轻松多了,不仅提高了工作效率还

ThingJS的博客 4127

things.js官方示例基本创建物体的方法(为阅读方便)

说明:创建App,url为场景地址(可选) /** * 说明:创建App,url为场景地址(可选) */ var app = new THING.App({ url: 'https://www.thingjs.com/static/models/storehouse' // 场景地址 }); 2.说明:创建一个Box,并在app的update事件中旋转Box,摄像机看Box /** * 说明:创建一个Box,并在app的update事件中旋转Box,摄像机看Bo..

lff18277233091的博客 1608

ThingJS学习总结

ThingJS概述 ThingJS 是物联网可视化PaaS开发平台,帮助物联网开发商轻松集成 3D 可视化界面。ThingJS 名称源于 物联网Internet of Things (IoT)中的 Thing (物),ThingJS 使用当今最热门的 Javascript 语言进行开发。不仅可以针对单栋或多栋建筑组成的园区场景进行可视化开发载丰富插件后,也可以针对地图级别场景进行开发。广泛

m0_37623485的博客 3574

ThingJS开发使用感受

出于为了实现有关厂区的数字孪生项目,断断续续使用ThingJS平台开发一年左右,做一个使用感受的总结。在编码方面,笔者的编码方式和博客中的描述基本一致:“由于平台提供的代码编码端体验不佳,我们不得不先在本地进行开发,再将相关代码复制到在线平台,而调试修改代码也是如此繁琐”。个人感觉至少现阶段的ThingJS还是比较适合做一些简单的业务场景、数据交互简单的项目,类似于大屏展示,这种纯数据展示;如果要实现一个较为庞大复杂的业务场景时,就不太方便,开发难度也会随之增加。

@Fonden 1315

ThingJS | 3D可视化】开发框架,一站式数字孪生

ThingJS一个基于WebGL和Three.js的开源3D JavaScript库,用于创建交互式的3D场景和应用程序。它提供了丰富的功能和工具,使开发人员能够简单而高效地构建各种类型的3D应用。ThingJS支持导入各种3D模型格式,并提供了各种渲染效果和交互功能,例如阴影、光照、碰撞检测等。

云散的博客 3113

ThingJS 和Threejs在3D开发框架性能上,谁更优秀?

开头: 1、 WebGL是一个3D画图标准协议,在浏览器上生成,对开发处理能力要求高,所以只懂JavaScript语言是不够的。WebGL网页组成成分:HTML5JavaScript和GLSL ES(着色器语言 OpenGL ES),信息量很庞大,对于小型商业项目难免投入太大,尤其是非开发人员,是很难理解的。所以,基于WebGL底层技术的3D开发工具应运而生。 封装是一种艺术,把晦涩难懂的图形学理论都抽象化了,只需要搬运即可。ThingJS不仅仅在技术上简化了开发方法,通过官方示例来以引导JS开发

ThingJS的博客 7224
上一篇: 进入ThingJS 3D场景,有两种简单的查询方法
下一篇: 3D商业项目难,ThingJS PAAS 降低开发门槛
ThingJS_小锘
博客等级 码龄6年 169粉丝 254原创
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值