如何通过脚本实现AIT画布切换
应用场景
在3D场景中，我们常用面板组件进行数据展示。但是受限于面板组件的尺寸，可用于数据展示的篇幅十分有限。因此在部分特定的场景下，会使用AIT画布进行数据展示。目前一个孪生项目只能挂载一个AIT画布，由此带来了多个AIT画布切换的需求。
本方法可实现两种AIT画布切换场景：
（1）同一个项目不同场景AIT画布切换，即一个项目存在多个场景，每个场景都需要具备自己的AIT数据展示画布；
（2）同一个场景下，不同设备通过点击事件切换AIT画布，即点击不同设备模型显示当前设备AIT画布。
操作步骤
编辑脚本—> 脚本挂载及使用
Step1（编辑脚本）
（1）通过场景切换实现AIT切换
脚本内容如下：
{
start: function (self, ctx) {
let ait = ctx.HUD_MANAGER.elements[1];
let smr = ctx.SCENE_MANAGER;
// 绑定场景切换事件
smr.subscribe('activeSceneObject', (e, scene) => {
// 检测当前场景名称，进行画布切换
if (scene.name === '场景 A') {
ait.code = 'ait-ceshijianxin71-63s4npbr';
return;
}
if (scene.name === '场景 B') {
ait.code = 'ait-liantiaodiaozhouduijieceshi71-63s8i3kf';
return;
}
});
},
}{
start: function (self, ctx) {
let ait = ctx.HUD_MANAGER.elements[1];
let smr = ctx.SCENE_MANAGER;
// 绑定场景切换事件
smr.subscribe('activeSceneObject', (e, scene) => {
// 检测当前场景名称，进行画布切换
if (scene.name === '场景 A') {
ait.code = 'ait-ceshijianxin71-63s4npbr';
return;
}
if (scene.name === '场景 B') {
ait.code = 'ait-liantiaodiaozhouduijieceshi71-63s8i3kf';
return;
}
});
},
}其中我们仅需要专注以下代码块即可：
if (scene.name === '场景 A') {
ait.code = 'ait-ceshijianxin71-63s4npbr';
return;if (scene.name === '场景 A') {
ait.code = 'ait-ceshijianxin71-63s4npbr';
return;scene.name ===‘场景名称’，填写实际场景名称即可；
ait.code =’画布链接’，填写画布链接即可。
画布链接获取方式如下：
打开AIT画布编辑页面，在地址栏查看当前画布地址信息。
直接复制至 & 中间内容即可。
注：如有多个场景需要进行切换，直接复制多个该代码段即可。
（2）通过点击对象实现AIT切换
脚本内容如下：
{
onClick: function(self, ctx) {
const ait = ctx.HUD_MANAGER.huds[1];
const hover = self.getParameter('__event_click__');
if (click / 2 == 1) {
ait.code = self.getParameter('code');
} else {
ait.code = 'ait-1112-jk7r6ve';
}
},
}{
onClick: function(self, ctx) {
const ait = ctx.HUD_MANAGER.huds[1];
const hover = self.getParameter('__event_click__');
if (click % 2 == 1) {
ait.code = self.getParameter('code');
} else {
ait.code = 'ait-1112-jk7r6ve';
}
},
}其中我们可以看该段代码：
if(click%2 ==1){
ait.code = self.getParameter(‘code’);
}
这里定义了对2求余结果为1，展示当前项目默认AIT画布，如无特殊需要，此处可以保持不变。
else{
ait.code = ‘’;
}
这里定义了当鼠标点击次数/2不等于1时，展示特定的AIT画布，脚本中需要填写AIT画布的Code链接。Code链接的获取方式同上。
Step2（脚本挂载及使用）
（1）通过场景切换实现AIT切换
在场景中增加空对象，挂载已经完成脚本，保存后进入预览态。
在预览态通过打开侧边栏，点击不同场景切换，实现对应AIT画布跟随切换。
（2）通过点击对象实现AIT切换
在目标对象上挂载已经完成的脚本，同时一定需要注意，需要挂载交互组件作为交互监听开关。
在保存项目后，在运行态点击目标对象实现项目默认AIT与目标对象指定AIT切换效果。