自定义鼠标事件

框架支持拾取鼠标事件

说明

INFO

支持对多种鼠标事件的回调

代码实例

<script setup lang="ts">
import { onMounted, onBeforeUnmount } from 'vue'
const LarkExplorer = window.LarkExplorer
let map: any
onMounted(() => {
  LarkExplorer.ready({
    baseUrl: './dist/resources/',
  }).then(initMap)
})

function initMap() {
  // 默认谷歌影像地图
  const baseImagery = LarkExplorer.BaseLayer.DefaultTdtImg

  // 默认全球地形
  const baseTerrain = LarkExplorer.BaseLayer.DefaultTerrain

  map = new LarkExplorer.Map('map', baseImagery, baseTerrain)
  console.log(map)
  initView()
}
function initView() {
  const status = {
    position: {
      x: -947707.6526854301,
      y: 5525655.629629169,
      z: 3043025.882299652,
    },
    hpr: {
      heading: 3.862207334800405,
      pitch: -0.3624409974692644,
      roll: 0.0001087727106403591,
    },
  }
  map.Navigation.flyToPos(status, 3)
}

let handler: any
const initEvent = () => {
  handler = new LarkExplorer.HandlerEvent(map.viewer)
  handler.onLeftDown((e: any) => {
    console.log('左键摁下：', e)
  })
  handler.onLeftUp((e: any) => {
    console.log('左键抬起：', e)
  })
  handler.onLeftDown((e: any) => {
    console.log('左键摁下：', e)
  })
  handler.onLeftClick((e: any) => {
    console.log('左键点击：', e)
  })
  handler.onLeftDoubleClick((e: any) => {
    console.log('左键双击：', e)
  })
  handler.onRightDown((e: any) => {
    console.log('右键摁下：', e)
  })
  handler.onRightUp((e: any) => {
    console.log('右键抬起：', e)
  })
  handler.onRightClick((e: any) => {
    console.log('右键点击：', e)
  })
  handler.onMiddleClick((e: any) => {
    console.log('中键点击：', e)
  })
  handler.onWheel((e: any) => {
    console.log('滚轮滚动：', e)
  })
  handler.onMove((e: any) => {
    console.log('鼠标移动：', e)
  })
}
const clearEvent = () => {
  handler && handler.destroy()
  handler = undefined
}

</script>

运行效果 更多示例