本帖最后由 18979425409 于 2023-5-18 18:45 编辑
ThingJS是一个专门用于IoT设备和物联网场景的3D可视化开发平台，它也支持在低代码的编程模式下快速构建可视化应用。如果要在ThingJS低代码开发中实现3D场景和森图表的交互，学习完本文章你可以实现，点击图表某一行，摄像机飞行到点击行物体所在位置。可以通过以下步骤实现：
1.将森图表或者森大屏导入到低代码中
2.查看图表dom元素
3.通过jquery或者js给图表绑定点击事件（本文章使用jQuery）
- // 创建“设备管理”列表交互事件
- function createEvents() {
- $(".list-body .list-li").on("click", function () {
- let name= this.children[0].children[0].title //获取点击的列表行的设备名称
- let device = app.query(/name/)[0] //查询到点击行的设备
- app.level.change(device) //层级切换到设备的父物体层级
- app.camera.flyTo({
- 'object': device, // 飞到该孪生体的位置
- 'time': 1000, //飞行时间
- xAngle: 30, //与x轴角度
- yAngle: 10,
- radius: 30, //离目标点距离（离目标点 n 倍物体自身包围盒半径距离处）
- complete: function () {
- device.style.outlineColor = "#d88333" // 设置孪生体边框的颜色}
- }
- })
- })
- }
4.涉及的知识点：
低代码中，坐标系的xyz轴是什么方向：https://developer.thingjs.com/t-2099.html
低代码中flyTo() API用法：https://support.thingjs.com/book/thingjs-api10/62a8170c6634aa32be547d1e#flyTo(param)
|
|
|
|
|
|
|
|
|
|
2042
0
