在Cesium中获取屏幕中心点坐标

实现效果

基本实现方法

// 获取屏幕中心点的坐标
function getScreenCenterPosition(viewer) {
    // 获取画布的中心点（屏幕坐标）
    var canvas = viewer.scene.canvas;
    var centerX = canvas.width / 2;
    var centerY = canvas.height / 2;
    
    // 将屏幕坐标转换为场景坐标
    var centerPosition = new Cesium.Cartesian2(centerX, centerY);
    
    // 使用相机获取该点的世界坐标
    var ray = viewer.camera.getPickRay(centerPosition);
    if (!ray) {
        return null;
    }
    
    // 获取地球表面的交点
    var position = viewer.scene.globe.pick(ray, viewer.scene);
    
    // 如果没有交点（看向太空），则返回相机指向方向的无限远点
    if (!position) {
        position = viewer.camera.pickEllipsoid(centerPosition, viewer.scene.globe.ellipsoid);
    }
    
    // 将笛卡尔坐标转换为地理坐标
    if (position) {
        var cartographic = Cesium.Cartographic.fromCartesian(position);
        var longitude = Cesium.Math.toDegrees(cartographic.longitude);
        var latitude = Cesium.Math.toDegrees(cartographic.latitude);
        var height = cartographic.height;
        
        return {
            longitude: longitude,
            latitude: latitude,
            height: height
        };
    }
    
    return null;
}

// 使用示例
var centerPos = getScreenCenterPosition();
if (centerPos) {
    console.log("屏幕中心点坐标：", 
        "经度: " + centerPos.longitude.toFixed(6), 
        "纬度: " + centerPos.latitude.toFixed(6),
        "高度: " + centerPos.height.toFixed(2));
}

高级实现（考虑地形和3D Tiles）

如果需要更精确的结果（考虑地形和3D模型），可以使用viewer.scene.pickPosition方法：

function getPreciseScreenCenterPosition(viewer ) {
    var canvas = viewer.scene.canvas;
    var centerX = canvas.width / 2;
    var centerY = canvas.height / 2;
    
    // 使用pickPosition获取精确位置（考虑地形和3D模型）
    var position = viewer.scene.pickPosition(new Cesium.Cartesian2(centerX, centerY));
    
    if (position) {
        var cartographic = Cesium.Cartographic.fromCartesian(position);
        return {
            longitude: Cesium.Math.toDegrees(cartographic.longitude),
            latitude: Cesium.Math.toDegrees(cartographic.latitude),
            height: cartographic.height
        };
    }
    
    // 如果pickPosition失败，回退到基本方法
    return getScreenCenterPosition(viewer );
}

实时监听屏幕中心点坐标

如果需要实时监听屏幕中心点的坐标变化（例如相机移动时）：

// 添加事件监听器
viewer.scene.postRender.addEventListener(showLangLat);

function showLangLat() {
    // 限制事件触发频率（节流）
    var now = Date.now();
    if (now - this.lastUpdate > 200) {
      // 每200毫秒最多触发一次
      this.lastUpdate = now;
      var centerPos = getScreenCenterPosition(window.viewer);
      this.longitude = centerPos.longitude.toFixed(5);
      this.latitude = centerPos.latitude.toFixed(5);
      this.setLangLatDomInnerHTML();
    }
  }