Thingjs 开门示例:以3D机柜为例 演示thingjs如何开门

简介: 动画的播放和暂停是3D场景中常用的功能,本文以机柜为例为您讲解在thingjs中使用playAnimation(params)接口控制机柜门开启和关闭,同理,房门开关、电器运行停止等3D模型的动画启停均可以使用此方法。

动画的播放和暂停是3D场景中常用的功能,本文以机柜为例为您讲解在thingjs中使用playAnimation(params)接口控制机柜门开启和关闭,同理,房门开关、电器运行停止等3D模型的动画启停均可以使用此方法。

用到的Thingjs API:

播放动画

playAnimation(params)

参数

 

Name Type Description
name String

动画名

frames? Array

帧播放比例范围

speed? Number

播放速度

loop? Boolean

是否循环

loopType? String

循环类型

reverse? Boolean

是否倒播

Example

obj.playAnimation('open1');
obj.playAnimation({
     name: 'open1',
     reverse: true,
});
obj.playAnimation({
     name: 'open1',
     loop: true
});
obj.playAnimation({
     name: ['open1', 'open2'],
     loop: true,
     loopType: 'pingpong',
     speed: 0.4
});
obj.playAnimation({
     name: ['open1'],
     frames: [0.25, 0.5], // 动画序列从 25% 播放到 50% (时间)
     loop: true,
     loopType: 'pingpong',
     speed: 0.4
});

机柜示例

//加载场景代码
var app = new THING.App({ 
    // 场景地址
    "url": "http://www.thingjs.com/./uploads/wechat/oLX7p04daC2OdoZCbP6VihD_0XCo/scene/men",
    //背景设置
    "skyBox" :"BlueSky"
});

var l = null;
// 初始化完成后进行场景层次管理注册操作
app.on('load', function (ev) {
    app.level.change(app.buildings[2]);
    var cabinet = app.query(/001/)
    cabinet.on('click',function() {
      if (l) l.playAnimation('close1');
      this.playAnimation('open1');
        l = this;
    });
});

 

ThingJS ™(www.thingjs.com):优锘科技开发的面向物联网的 3D 可视化 PaaS 开发平台.基于 WebGL 兼容各种浏览器及移动设备.零门槛、高效率、低成本开发各类 3D 应用。

目录
相关文章
QGS
|
XML 前端开发 JavaScript
手搭手Ajax经典基础案例省市联动
手搭手Ajax经典基础案例省市联动
QGS
59 1
|
监控 数据可视化 安全
如何使用webgl(three.js)实现煤矿隧道、井下人员定位、掘进面、纵采面可视化解决方案——第十九课(一)
three.js、webgl、3D煤矿隧道、三维井下人员定位、掘进面三维可视化、纵采面可视化、采集面可视化展示、设备检测、数字孪生、物联网3D、3d建筑、3d库房,bim管理系统
341 1
|
5月前
|
传感器 算法 Ubuntu
大疆M2006电机测试文档
本文是关于大疆RoboMaster M2006电机的测试文档,介绍了在Ubuntu20.04环境下通过ROS读取电机反馈信息、控制电机移动,并利用PID控制算法实现速度闭环的测试流程,涵盖了测试材料、接线方法、电机校准、CAN通讯测试以及在ROS中的移植和PID调节的详细步骤和方法。
250 0
大疆M2006电机测试文档
|
5月前
|
传感器 C# 监控
硬件交互新体验:WPF与传感器的完美结合——从初始化串行端口到读取温度数据,一步步教你打造实时监控的智能应用
【8月更文挑战第31天】本文通过详细教程,指导Windows Presentation Foundation (WPF) 开发者如何读取并处理温度传感器数据,增强应用程序的功能性和用户体验。首先,通过`.NET Framework`的`Serial Port`类实现与传感器的串行通信;接着,创建WPF界面显示实时数据;最后,提供示例代码说明如何初始化串行端口及读取数据。无论哪种传感器,只要支持串行通信,均可采用类似方法集成到WPF应用中。适合希望掌握硬件交互技术的WPF开发者参考。
95 0
|
8月前
|
前端开发 JavaScript 程序员
用代码的方式,把我想说的情话呈现给你 💌
用代码的方式,把我想说的情话呈现给你 💌
119 0
NFT卡牌游戏链游系统开发(开发方案)/详情规则/成熟技术/设计界面/案例项目/源码程序
NFT (Non Homogeneous Token) card chain game refers to a game based on blockchain technology where NFT is used as the card in the game. NFT is a unique and non interchangeable digital asset that can represent various virtual cards, props, or characters in the game.
|
SQL 监控 数据库
【乌拉喵.教程】“多负载识别监控平台(上位机)”技术细节 之Unit2-Form2用户电量查询显示界面
【乌拉喵.教程】“多负载识别监控平台(上位机)”技术细节 之Unit2-Form2用户电量查询显示界面
103 0
|
区块链 开发者
Jogger慢跑者跑鞋零撸模式系统开发详细规则/逻辑分析/案例详情/项目方案/源码部署
  DApp是指以区块链为底层技术平台的分布式应用程序,它使得开发者可以构建去中心化和自主运行的应用程序,并通过链上的合约机制实现代码不可更改性和事务透明性。
|
传感器 网络协议 物联网
5_1_1_首页信息展示屏_整体介绍_技术点及获取电池电量|学习笔记
快速学习5_1_1_首页信息展示屏_整体介绍_技术点及获取电池电量。
330 0
5_1_1_首页信息展示屏_整体介绍_技术点及获取电池电量|学习笔记
|
测试技术
接口测试平台代码实现147: 平台主题-夏日清凉-终
接口测试平台代码实现147: 平台主题-夏日清凉-终
接口测试平台代码实现147: 平台主题-夏日清凉-终