arcgis 4.x 入门学习三 (地图的事件触发机制)
作者:互联网
1.4.x 和 3.x地图的触发机制的区别
arcgis 4.x 引入了webgl的结构,导致渲染方式发生了翻天覆地的变化,事件的机制已经和3.x完全不同了, 学习起来会有点难受
1. 点击事件
//双击事件的话就用dblclick
view.on("click",(event)=>{ //mapPoint是指你鼠标当前点击的位置 console.log(event.mapPoint); // 因为。webgl 我也不知道怎么说 反正这种规范下一定要对平面坐标和世界坐标进行转换 view.hitTest(event).then((response)=>{ // 转换完毕后 判断点击触发到的几何目标数组 if(response.results[0]){ // 如果存在 触发相应的事件 var graphic = response.results[0].graphic; // 我自己的处理是判断graphic是否带有click函数,如果存在这个函数这执行,回调返回自己以及可能会用到的对象,这个click是我在创建graphic的时候自己添加的 不是属于arcgis规范, 这一块大家仁者见仁智者见智了 graphic.click && graphic.click(graphic,event,response,view); } }) })
2. 摄像头变化
4.x采用的对象全是双向绑定的对象( vue直呼内行 ) 对任意对象下的属性都可以用watch进行监听变化 (这里指大部分....)
// 监听摄像头的变化 view.watch('camera',(camera) => { // 基本上 在4.x里面 所有的地图拖动 旋转 本质上都是摄像头的变化 });
3. 监听arcgis 4.x mouseout mouseover事件 (鼠标移入 移出事件)
这个真的有点复杂 希望看得人没事 头晕了就休息一下
// 监听几何响应鼠标事件 var viewMouseover = []; // 万恶的arcgis4.x 取消了mouseout mouseover的支持 只有这个了 view.on("pointer-move", (event)=>{ // 传统异能 屏幕转世界 view.hitTest(event).then(function(response) { for( var i = 0; i < viewMouseover.length; i++ ){ var graphic = viewMouseover[i]; if( response.results.map((e)=>{ return e.graphic }).indexOf(graphic) === -1 ){ // 进入这里就是已经判断移出了 if( graphic.cursor ) { document.body.style.cursor = ""; } // 我还是监听当前移出的graphic是否有我定义的mouseout事件,如果没有这个属性也就不管他了 graphic.mouseout && graphic.mouseout(graphic,event,response,view) viewMouseover.splice(i,1); i--; } } response.results.map((e)=>{ return e.graphic }).forEach((graphic,i)=>{ if( i === 0 && graphic.cursor ) { document.body.style.cursor = graphic.cursor; } if( viewMouseover.indexOf(graphic) === -1 ){ // 这里就是判断已经移入的graphic viewMouseover.push(graphic); // 我的传统艺能, 就不解释了吧。。。 graphic.mouseover && graphic.mouseover(graphic,event,response,view) } }) }); });
标签:触发,graphic,入门,event,arcgis,mouseout,viewMouseover,response,view 来源: https://www.cnblogs.com/liao1992/p/13960097.html