1、 绑定事件并增加条件
2、 同一个事件注册多个回调
3、 tag 标签
4、 设置事件优先级
5、 注册单次事件
事件不会本人执行,须要触发(即事件被触发之后才可执行)。扫视任何JavaScript代码的外围,你会发现正是事件是把所有货色交融在一起。上面我学习了一些在数字孪生可视化场景中事件的罕用办法。

1、 绑定事件并增加条件

事件增加了条件,只有在合乎该条件的数字孪生可视化物体上 click 才会触发,无论是曾经存在的 Thing 对象,还是前面新创建的 Thing 对象都会失效。

app.on("click", ".Thing", function(ev) { console.log("you click " + ev.object.id);});obj.on("click", ".Marker", function(ev) { console.log(ev.object.name);});

下面的例子,当这个数字孪生可视化物体子孙里有 Marker 物体,当它被点击就会触发。同全局绑定 Marker 物体,绑定后 obj 的子孙里新创建的 Marker 也响应这个事件。

2、 同一个事件注册多个回调

试想一下,如果有一个模块在数字孪生可视化物体 click 时,扭转物体色彩,另外一个模块须要在物体 click 时,放大物体。两个模块又是不同人写的,那该如何注册事件呢?

// 事件1:obj.on("click", function(ev) { ev.object.style.color = "#FF0000";});// 事件2:obj.on("click", function(ev) { ev.object.scale = [2, 2, 2];});// 卸载 obj 全副的 click 事件obj.off("click");

这两个事件,都会在 obj 被点击后触发。但应用 off() 卸载事件时,两个事件都会同时被卸载。因而我更举荐应用[tag]的形式。

3、 tag 标签
如果勾销或者暂停事件,都要晓得原回调函数,在大部分时候会比拟麻烦,能够给数字孪生可视化场景中每个事件打上 tag,在删除或者暂停时,可用 tag 间接指定你要操作的回调。

//模块1中:obj.on("click",function(ev) { ev.object.style.color = "#FF0000";},"模块1"); //模块2中:obj.on("click",function(ev) { ev.object.scale = [2, 2, 2];},"模块2");//勾销"模块1"的事件回调,不影响“模块2”的回调obj.off("click",null ,"模块1");

4、 设置事件优先级

两个都是 click 事件,如果心愿保障模块 2 的事件先于模块 1 触发,则须要增加一个参数 priority,个别事件默认的优先级是 50,设置的越大,越优先触发。

//模块1:obj.on("click",function(ev) { ev.object.style.color = "#FF0000";},"模块1"); //模块2:obj.on("click",function(ev) { ev.object.scale = [2, 2, 2];},"模块2",51);

5、 注册单次事件

在数字孪生可视化场景中如果须要一个事件只执行一次,就须要卸载掉,你能够应用 one 这个接口代替 on,参数和 on 是一样的。
提供 priority 的能力:

// 下例中是给每个楼层的注册了一次 EnterLevel 事件,即 每个楼层第一次进入时 都会响应app.one(THING.EventType.EnterLevel, '.Floor', function (ev) { console.log(ev.object.id);}) // 如果只给某个楼层注册 如下var floor = app.query('.Floor')[0];floor.one(THING.EventType.EnterLevel, function (ev) { console.log(ev.object.id);})

—————————————————
数字孪生可视化:https://www.thingjs.com/