首先理解概念:事件是用户或浏览器执行的某个动作。例如:click、load等都是事件的名称。事件处理程序是响应事件的函数。事件处理程序名称以“on”开头。例如:事件点击--->事件处理器onclick(事件处理器一般为小写字母)。ThingJS系统内置了很多事件,比如鼠标点击、键盘输入、图层变化等,你可以监听这些事件,在事件回调中进行相应的业务逻辑处理。全局绑定事件和局部绑定事件操作,以及数字孪生可视化场景变化,都会触发相应的事件。你可以监听这些事件,然后在回调方法中做相应的处理,通过on()方法绑定事件。1、全局绑定:通过app.on()绑定事件,可以在全局上下文中添加条件指定事件绑定到哪些对象。条件规则与查询中使用的规则相同。//绑定事件app.on("click",function(ev){console.log("youclick!");});注意:全局绑定后,新创建的符合条件的对象也可以生效。2、本地绑定:对于数字孪生可视化对象,或者查询的查询结果(Selector),通过on接口绑定事件,称为本地绑定。与全局绑定一样,可以在事件中添加条件,表示该事件绑定是针对集合中所有数字孪生可视化对象的。obj.on("click",function(ev){console.log(ev.object.name);});实际应用,在数字孪生可视化场景中创建鼠标点击事件,并打印拾取的对象id;为鼠标的双击事件原地创建一个小球;并向所有建筑对象添加鼠标悬停事件。完整代码如下:varapp=newTHING.App({url:'https://www.thingjs.com/static/models/storehouse'});//鼠标点击事件,打印拾取的对象id(clickDouble-taptriggersbothClick双击时会触发两次)app.on('click',function(ev){if(ev.picked){console.log('点击:'+ev.object.id);}});//鼠标点击事件,打印选中的对象idapp.on(THING.EventType.SingleClick,function(ev){if(ev.picked){console.log('SingleClick:'+ev.object.id);}});//鼠标双击事件,原地创建一个小球app.on('dblclick',function(ev){console.log('dblClick');//e.button0为左键,2为右键按钮if(!ev.picked||ev.button!=0){return;}app.create({type:'Sphere',radius:0.5,position:ev.pickedPosition});});//对于所有建筑物对象,添加鼠标悬停事件app.on('mouseenter','.Building',function(ev){ev.object.style.outlineColor='#0000FF';});app.on('mouseleave','.Building',function(ev){ev.object.style.outlineColor=null;});————————————————————数字孪生可视化:https://www.thingjs.com/
