Cesium區分單擊【LEFT_CLICK】和雙擊事件【LEFT_DOUBLE_CLICK】

問題描述

在cesium中，用戶滑鼠左鍵雙擊視圖或Entity時，實際觸發的是兩次click和一次dbclick事件，非常影響代碼設計，本文記錄瞭如何區分單擊【LEFT_CLICK】和雙擊事件【LEFT_DOUBLE_CLICK】的代碼及原理方法。

具體代碼

var timer= null;
var handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
handler.setInputAction(function(movement){
    clearTimeout(timer);
    timeoutID= window.setTimeout(function(){
      console.log('左鍵單擊事件：',click.position); //這裡處理單擊事件代碼
    }, 200);
},Cesium.ScreenSpaceEventType.LEFT_CLICK);
     
handler.setInputAction(function(movement){    
    clearTimeout(timer);    
}, Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK );

代碼解析

單擊：用戶單擊 - 清除定時器 - 定時器賦值 - 200ms後執行相應單擊代碼 - 單擊事件完成。
雙擊：用戶雙擊 - 進入到單擊事件 - 清除定時器 - 定時器賦值 - 200ms後執行相應單擊代碼 - 進入到雙擊事件 - 清楚定時器 - 單擊事件代碼取消執行。