Skip to content

概述

Cesium的事件体系主要分为 场景事件、相机事件、实体事件、输入事件(鼠标/触摸) 等几大类。它们大多由 Cesium.EventCesium.ScreenSpaceEventHandler 驱动,用于监听用户交互或内部状态变化。

输入事件

javascript
 const handler = new Cesium.ScreenSpaceEventHandler(viewer.canvas)
handler.setInputAction(function (e) {
  const cartesian = viewer.scene.pickPosition(e.position)
  const cartographic = Cesium.Cartographic.fromCartesian(cartesian)
  console.log(cartographic, cartesian)
  const lon = Cesium.Math.toDegrees(cartographic.longitude)
  const lat = Cesium.Math.toDegrees(cartographic.latitude)
  info.value.innerHTML = `lon: ${lon}, lat: ${lat}`
  info.value.style.left = e.position.x + 10 + 'px'
  info.value.style.top = e.position.y + 10 + 'px'
}, Cesium.ScreenSpaceEventType.LEFT_CLICK)

DOM元素

javascript
const cartesian = Cesium.Cartesian3.fromDegrees(121.47, 31.23)
viewer.scene.postRender.addEventListener(() => {
  const windowPosition = Cesium.SceneTransforms.worldToWindowCoordinates(viewer.scene, cartesian)
  if (windowPosition) {
    point.value.style.left = windowPosition.x + 'px'
    point.value.style.top = windowPosition.y + 'px'
  }
})
/