ThingJS 3D场景切换,如何轻松实现

ThingJS官方案例(五):物联网室内3D定位导航,上下楼怎么办? #3D开发##3D模型# 单楼层导航定位 楼层切换导航路径 第一&第三人称视角 用户需要购买名牌香薰,又或者用餐时想吃泰国菜,在庞大、复杂又容易迷路的购物中心,并不是易事。国内购物中心内几乎都遍布了Wi-Fi热点,其实利用Wi-Fi热点进行室内定位和导航,在技术层面已经成熟。 物业管理考虑更多的是建筑、楼宇和设备管理,从而保障商家、用户的消防安全,这些都是背后看不见的成本。 **- 首先定位和导航,需要绘制室内地图。**店铺外观和名字的修改过于频繁,所以需要进行管理,对模型外观进行修正。Thing 阅读详情

动态切换是一个ThingJS 3D开发推出的小功能,利用一个按钮就可以轻松实现!

一个复杂的物联网项目都是实景模拟,人居环境会有多个场景组合而成,而且在项目开发过程中,可能建模的人员都不一样,制作的场景都可能在不同的位置,如何做场景切换呢?这个功能官方例程中就写得很清楚,跟我来看看吧!
在这里插入图片描述

使用ThingJS官方神奇模模搭来搭建场景,这个相信大家都很熟悉,它的场景能够自动同步到ThingJS网站中去,毕竟是一家亲,如果ThingJS在线平台找不到,那不是平台的问题,而是你的操作问题!记得回到模模搭客户端查看是否同步完全,或者是上传的obj模型因为标准或者规范的问题而被拒绝的,就可能导致场景无法正常同步,只要查看标准文档进行操作就可以啦!

物联网可视化项目主要涉及大型而复杂的园区、地理地形或者工程等,越复杂就越需要合理规划,ThingJS是如何简化这些开发流程的呢?我们是有神器助攻的!ThingJS经过多年开发经验的沉淀,得出了四个开发步骤:场景搭建、在线开发、数据对接、项目部署,同时把建模和开发分开,设计人员使用CampusBuilder(又称模模搭)或者cityBuilder搭建工具,无代码轻松拖拽元素即可制作模型,随后开发人员使用ThingJS在线开发,从官方示例了解最新的酷炫功能,基于JS代码轻松开发,不需要额外培训!

模模搭可以选择对应的模型搭建一个工厂或者是粮仓,但是特殊模型也有,可以从其他位置加载并上传使用,ThingJS推荐使用3DMAX工具搭建特殊模型,并提供3DMAX上传插件来完成传输,这些插件资源都可以在官网-资源中心下载。

在线开发的时候如何引用任何场景的URL,步骤如下:使用快捷键Ctrl+J或者直接点击园区icon打开园区界面,双击对应场景即可出现该场景的URL,引用完毕之后,参考如下官方示例进行不同的场景切换,一切清楚明白无保留!

如何进行一个场景的动态切换,有以下三步:
1、首先要有两个以上可以选择切换的场景,在模模搭场

百闻不如一见,ThingJS有哪些3D地图信息弹窗功能呢? 大家都有试过,在百度地图中选中一个地方后就会弹出该地信息的对话框。ThingJS的3D地图实景,有哪些信息弹窗功能呢? 无论是2D地图还是3D地图,经常会有展示信息面板的需求,可以用来表示物体对象的位置,也可以实时展示某物体的状态。在ThingJS开发教程中,这些有地理位置的坐标,我们称之为“信息弹窗InfoWindow”。 thingjs开发中支持使用layer来显示Web界面的信息弹窗。为了更加方便前端用户操作,我们使用THING.Utils.dynamicLoad引用layer的官方JS文件,可在场 阅读详情

相关推荐

ThingJS 3D场景层级切换,体验不一样的动感!

若ThingJS 3D开发与真实世界的设备相关联,获取场景发送的设备属性数据,就能够真正实现物联网的控制操作。三维数据可视化分析,离不开场景搭建,通过对设备或楼层的仿真模拟,并且利用进出层级和聚焦物体等控制方法,在智能安防或培训层面做到更加直观、有效。 ThingJS使用app.level.change(ev.campus);这个进出层级、聚焦物体的代码来注册进出层级事件,该事件可以实现楼层的进出,有自定义属性或是ID属性物体的双击聚焦功能。 ThingJS 3D开发如何实现进出层级?超简单! 今天我们来详

ThingJS的博客 2027

ThingJS官方示例(七):室内导航定位查询能力,轻松开发不难

#前端开发##3D可视化# 导航标注动画定制 第一人称动态导航 多楼层导航模式 楼层展开功能推介 三维室内地图包含丰富的环境信息,真实展示外部环境,尤其是复杂的室内商场,遇到消防险情或者事故报警,如何尽快定位,以最快的速度到达现场?使用三维地图定位查询导航,在虚拟场景进行交互,足不出户就能够完成路径规划和指挥智能。 工厂的生产车间、交通要道的场内监控点,遇到应急事件一样需要路径导航规划的辅助哟!ThingJS提供的室内导航查询定位方法,并不是新技术,应该说是常见的定位方法。ThingJS提供JS类库在

ThingJS的博客 1761

ThingJS API 2.0全面进化更适合数字孪生应用

一、ThingJS 1.0 为降低3D门槛而生 2018年,ThingJS API 1.0极大地降低了3D可视化应用开发门槛!通过高度的功能封装,其他引擎用千余行代码实现的功能,在ThingJS中只用一行代码就能搞定!不仅如此,通过简化场景加载、自定义物体创建、自定义层级切换等一系列逻辑设计,让没有 3D 开发经验的人,也能快速开发出自己想要的物联网3D可视化应用。 随着数字化转型浪潮,我们希望ThingJS能提供更多样的垂直行业场景管理能力,成为更开放的数字孪生引擎。所以,2020年底,开始进行2.0

ThingJS的博客 1949

特色国风数字孪生智慧大坝 3D 可视化

前言 水利兴,五谷丰。水利作为国民经济稳定和谐的重要部分,不仅有防洪减灾、农业灌溉、城市供水调水、渔业外贸、旅游航运、生态环境等综合应用,水电资源也是至关重要的可持续能源之一。大坝与水库、水电站等水利枢纽相辅相成稳定着城市发展。而随着信息化的发展,结合物联网、 5G 、大数据等新兴技术形式的智慧水电站、智慧大坝也给传统水利行业提供更大的价值体现,提升产业全面感知、共享整合、智慧管理。 今天将利用 Hightopo 的 HT 产品搭建出一个水墨风的山水大坝 3D 可视化场景。通过三维建模,多种角度直观展示

HT for Web 3D 2303

数字孪生开发:端渲染与流渲染融合架构实战解析

在三维可视化与数字孪生应用开发中,实时渲染技术是核心基础。其原理是通过图形API(如WebGL/WebGPU)调用GPU进行模型、光照与材质的实时计算与绘制,以生成动态图像。这项技术的价值在于能够创建可交互、沉浸式的虚拟环境,广泛应用于智慧城市、工业仿真、产品展示等领域。然而,单一渲染模式面临挑战:端渲染依赖终端算力,难以承载超大规模高精度场景;流渲染虽能利用云端强大GPU实现影视级画质,但存在固有网络延迟,影响交互实时性。因此,结合两者优势的混合渲染架构成为解决复杂数字孪生项目需求的关键。本文聚焦于分层混

weixin_33851177的博客 394

ThingJS:如何快速生成3D动画?

场景搭建之后,内置动画的模型如何快速生成? 对于 Thing 类的对象,是通过 url 加载的模型,很多模型在制作阶段就内置了动画。 如果模型有内置动画,则可以在 ThingJS 中利用 API 调用播放这些动画。 如果是动态创建的物体,由于模型加载是异步的,则必须在模型加载完成后才能调用动画。 1. 获取模型动画 首先我们通过 animationNames 属性获取上图中的模型都有什么动画。 示例: console.log(obj1.animationNames); 输出: 播放模型动画 我们使

ThingJS的博客 1161

ThingJS本地加载速度提升10倍,复杂场景不愁!

大型3D场景结构复杂,对精度要求很高,大量数据带来了甜蜜的烦恼。为了降低数据传输压力,ThingJS开发了浏览器常规临时缓存持久化技术,复杂场景加载不再愁! 这是一个基于浏览器的本地缓存功能,由ThingJS平台提供的thing.cached.min.js库封装提供,按照JS脚本提供的代码执行加载本地3D场景。 以下是详细的操作步骤,欢迎体验! 引用thing.cached.min.js文件封装库 第一次加载场景,先把文件后缀为’glb’, ‘gltf’, ‘bin’, ‘json’, ‘jpg’, 'p

ThingJS的博客 2618

ThingJS:如何一键生成3D城市地图

ThingJS除了PASS能力,还提供了CampusBuilder/CityBuilder等SAAS平台,用来实现3D地图的交互配置,属于ThingJS可视化搭建组件之一。而且,CityBuilder还支持JS代码编辑,无代码进行创作,让3D地图开发成为设计人员也能够上手、和开发人员良好协作的一款产品。 ThingJS提供了一个城市场景的搭建工具CityBuilder,可以自动搭建3D城市地图,不需要我们另外去使用3Ds max等工具来制作模型,否则的话项目开发复杂度会高很多。一个好消息就是,ThingJS

ThingJS的博客 5851

ThingsBoard教程(三三):在页面添加按钮,触发函数,并配置国际化

thingsbaord页面添加按钮,dom元素,点击触发函数,并配置按钮的国际化。

知无涯 4307

KEIL-MDK代码美化神器:AStyle配置全攻略(附常用参数详解)

本文详细介绍了如何在KEIL-MDK中配置和使用AStyle代码格式化工具,包括基础参数设置、高级格式控制、团队协作方案以及KEIL深度集成技巧。通过合理的AStyle配置,开发者可以显著提升代码风格一致性,优化团队协作效率,特别适合嵌入式开发项目。

weixin_30505225的博客 149

ADS新手必看:5分钟搞定Smith圆图阻抗匹配(附详细操作截图)

本文为射频电路设计新手提供了在ADS软件中快速使用Smith圆图进行阻抗匹配的实战指南。通过清晰的步骤和操作截图,详细演示了如何从负载阻抗点出发,通过添加电感和电容元件,在5分钟内完成向50欧姆标准阻抗的匹配,并介绍了仿真验证与性能调优的方法,帮助工程师和学生直观掌握这一核心技能。

weixin_29261711的博客 395

TexGen模型导出到ABAQUS的inp文件:如何快速修改纱线材料属性(避坑指南)

本文针对TexGen模型导出到ABAQUS的inp文件后纱线材料属性缺失或错误的问题,提供了高效的解决方案。文章详细解析了inp文件结构,指导用户如何手动定位并修改纱线材料属性,并提供了可批量处理的Python脚本,帮助用户快速、精准地完成材料参数赋值,有效提升复合材料仿真工作效率。

ice55的博客 603

运放相位补偿的180°秘密:为什么你的电路在阶跃信号下会抽风?

本文深入探讨了运放电路在阶跃信号下产生振荡的根本原因——相位裕度不足,并揭示了相位补偿技术的核心秘密。通过分析稳态与瞬态响应的差异,结合反馈电路设计中的实际案例,详细讲解了滞后补偿、超前补偿等方法的原理与应用,帮助工程师精准解决电路“抽风”问题,确保系统动态稳定性。

xxx12的博客 642

Nordic nRF52832实战:手把手教你搭建智能手环BLE通信框架(附完整代码)

本文详细介绍了如何使用Nordic nRF52832芯片搭建智能手环的BLE通信框架,涵盖芯片优势、协议栈初始化、低功耗广播策略及健康数据服务实现。通过完整代码示例和架构设计,帮助开发者快速掌握蓝牙低功耗通信技术,适用于可穿戴设备开发。

weixin_29192141的博客 249

Python编程基础05:运算符与表达式

文章目录一、算术运算符1、分类说明表2、注意事项3、案例演示任务1、计算成绩差与平均成绩课堂练习:编程处理带余除法。任务2、打印购物小票 运算符就是专门用于告诉程序执行特定运算或逻辑操作的符号。表达式是指由常量、变量和运算符组成的一个算式。编写程序对数据进行处理,其实处理就是对数据实施各种各样的运算,搞懂运算符与表达式是我们编写程序的基础性工作,本次讲课笔记通过案例讲解各种运算符的用法以及正确书写Python表达式的注意事项。 一、算术运算符 Python中的算术运算符就是用来处理四则运算的符号,也是

howard2005的专栏 3120

EtherCAT主站SOEM -- 19 --Qt-Soem通过CSP模式(周期同步位置模式)控制一个电机转圈圈

以上就是EtherCAT主站SOEM – 19 --Qt-Soem通过CSP模式(周期同步位置模式)控制一个电机转圈圈的内容。有不明白的地方欢迎留言;有建议欢迎留言,我后面编写文档好改进。创作不容,如果文档对您有帮助,记得给个赞。

常驻客栈的博客--嵌入式EtherCAT 1999

你的小龙虾 OpenClaw 还很笨?快给它装上这几个核心技能(OpenClaw 必装skills整理)

🦞 刚装小龙虾OpenClaw? 本文分享一些OpenClaw必装技能,从视觉理解到智能学习,让它从“会聊天”变“会干活” 🚀

XiaoqiangClub的博客 871

计算机控制技术及应用

《计算机控制技术及应用》通过总结作者的科研成果和吸收国内外的先进理论、方法和技术,以计算机控制系统的网络化、开放化、智能化和集成化发展趋势为主线索,主要介绍计算机控制系统的基本概念和计算机控制系统的典型形式,计算机控制系统的数学描述与基本分析方法,以及数字PID控制器、最少拍控制系统、达林算法、状态变量设计法等设计方法及其各种改进算法。重点突出计算机控制系统输入输出通道接口的设计方法和典型控制系统的设计案例与实现方法等。

VC中sqlite的使用

在VC中对sqlite的使用,实现数据库大批数据的快速插入,读取数据库中的数据在ListCtrl中显示

汉书HE8,好用的汇编代码编写工具

汉书HE8,好用的汇编代码编写工具早期编写汇编代码所用功能强大

上一篇: 轻松挑战3D场景开发,ThingJS只需4步做完
下一篇: 摄像机飞行视角是点睛之笔!ThingJS助力3D可视化管理
ThingJS_小锘
博客等级 码龄6年 170粉丝 254原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明:

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

余额充值