ThingJS：3D开发基于js就可以实现change表单事件啦

最新推荐文章于 2024-08-23 10:47:48 发布

ThingJS_小锘

最新推荐文章于 2024-08-23 10:47:48 发布

阅读量252

点赞数

CC 4.0 BY-SA版权

分类专栏： ThingJS 3D可视化物联网文章标签： javascript

本文链接：https://blog.youkuaiyun.com/ThingJS/article/details/108889581

这篇博客介绍了如何利用ThingJS进行3D开发，特别是新推出的change事件功能，允许开发者结合JavaScript处理2D图形面板中的表单变化。文章详细讲解了创建面板、添加string组件、复选框组件、布尔开关组件和单选框组件的步骤，并展示了如何通过iframe组件实现页面切换。通过这些组件，开发者可以实现温度、雾效和页面动态交互，从而简化3D项目的开发过程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

改变能改变的,接受不能改变的。Change事件也是如此，它只能识别组件数据，ThingJS新功能出炉！3D开发基于js就可以实现change表单事件啦！
Change有“改变”的意思，当元素的值发生改变时，会触发 change 事件。
如何结合2D图形面板和js语法来做3D开发？ThingJS做个好示范，教你着手开发不同物体的温度、雾效和iframe页面。官方新推出change事件的功能，对应各种3D效果元素的值的变化，方便在GUI（图形界面）手动操作，直接生成js代码。
Change事件指代一系列用于改变场景元素的界面组件，都有哪些组件呢？比如string组件、复选框组件、布尔开关组件、单选框组件、iframe组件，都可以一一加入开发序列。
下面就来一一解析一下。首先要绑定界面组件数据，再创建面板和添加相关组件，注意在创建过程中会通过一些颜色或者动画效果来动态呈现变化，包括变色、切换等。

创建面板

// 用于界面组件数据绑定
var dataObj = {
    temperature: '30',
    checkbox: {
        'car01': true,
        'car02': false,
        'car03': false,
    },
    switch1: false,
    radio: '首页',
    iframe: 'https://www.thingjs.com'
};
// 创建面板
var panel = THING.widget.Panel({
    titleText: '面板',
    hasTitle: true,
    width: '300px&

最低0.47元/天解锁文章