森大屏的引用和切换

回复

本帖最后由夏天骑冷月于 2023-3-14 14:58 编辑

目前森大屏已经是支持在低代码环境中加载了，可直接在我的图表中找到对应的森大屏图表进行引入

森大屏的引用和切换

找到对应的森大屏资源双击即可引用.
(1)森大屏如何切换加载另一套森大屏
可定于变量 chart 将ui赋值给chart，之后就可以通过destroy（）方法清除大屏，再加载其他的大屏图表，以下是代码示例。可更换为自己的图表id查看效果

var chart
// 在线开发引入森大屏图表脚本
THING.Utils.dynamicLoad(['https://www.thingjs.com/static/plugins/thing.charts.min/1.0.0/thingjs-charts.umd.js'], function () {
// 创建图表
new THING.CHARTS({
id: 'ca245fce3cc34568bb8be790f7677416', // 场景id
el: document.getElementById('div2d'), // 挂载节点
baseUrl: 'https://charts.thingjs.com', // 地址
hide3D: true, // 隐藏场景内的3D，默认为false
hideCanvasBackground: true, // 画布背景色是否设置为透明的，默认false
complete(ui) {
// 回调函数，ui是场景实例
// ui.destroy()
chart = ui
},
})
})
// 加载完成事件
app.on('load', function (ev) {
/* 参数:
* ev.campus 园区,类型:Campus
* ev.buildings 园区建筑物,类型:Selector
*/
var campus = ev.campus;
console.log('after load ' + campus.id);
// 切换层级到园区
app.level.change(campus);
app.on(THING.EventType.EnterLevel, '*', function (ev) {
chart.destroy()
new THING.CHARTS({
id: 'bbfe09528d9245b7be8a68f5aceaa03c', // 场景id
el: document.getElementById('div2d'), // 挂载节点
baseUrl: 'https://charts.thingjs.com', // 地址
hide3D: true, // 隐藏场景内的3D，默认为false
hideCanvasBackground: true, // 画布背景色是否设置为透明的，默认false
complete(ui) {
// 回调函数，ui是场景实例
console.log(ui, ui.el)
}
})
})
})