如何为动态位置的Entity添加选中时显示的当前位置描述？

嘿，这个需求我之前也帮人处理过，核心就是让描述内容能动态抓取Entity的当前实时位置——毕竟你的Entity位置是随时间变化的，写死初始值肯定行不通。下面给你两种实用的实现方式：

方法一：用CallbackProperty自动更新描述 #

Cesium的CallbackProperty专门用来处理需要动态计算的属性，它会在每次需要渲染描述的时候自动触发回调，返回最新内容，完美适配你这种位置动态变化的场景：

// 假设你已经创建了动态变化的位置（比如用SampledPositionProperty或CallbackProperty）
const dynamicPosition = new Cesium.SampledPositionProperty();
// 这里省略给dynamicPosition添加时间点位置的代码...

// 创建目标Entity
const movingEntity = viewer.entities.add({
    position: dynamicPosition,
    point: {
        pixelSize: 10,
        color: Cesium.Color.RED
    },
    // 关键：用CallbackProperty生成动态描述
    description: new Cesium.CallbackProperty(() => {
        // 获取当前时间节点下的Entity位置
        const currentCartesian = movingEntity.position.getValue(viewer.clock.currentTime);
        if (!currentCartesian) {
            return '<p>暂无位置数据</p>';
        }
        // 把笛卡尔坐标转换成经纬度（度数格式）
        const cartographic = Cesium.Cartographic.fromCartesian(currentCartesian);
        const latitude = Cesium.Math.toDegrees(cartographic.latitude).toFixed(6);
        const longitude = Cesium.Math.toDegrees(cartographic.longitude).toFixed(6);
        
        // 返回HTML格式的描述内容
        return `
            <div>
                <h3>移动实体信息</h3>
                <p>当前纬度：${latitude}°</p>
                <p>当前经度：${longitude}°</p>
            </div>
        `;
    }, false)
});

这种方式的好处是完全自动化，不需要额外监听事件，Cesium会帮你处理更新时机，不管Entity什么时候被选中，显示的都是最新位置。

方法二：监听选中事件手动更新描述 #

如果你需要更精细的控制（比如只有选中时才计算位置，或者要结合其他交互逻辑），可以监听Viewer的selectedEntityChanged事件：

// 先创建基础Entity，初始描述设为提示内容
const movingEntity = viewer.entities.add({
    position: dynamicPosition,
    point: {
        pixelSize: 10,
        color: Cesium.Color.RED
    },
    description: '<p>选中查看当前位置</p>'
});

// 监听选中实体变化事件
viewer.selectedEntityChanged.addEventListener((newEntity) => {
    // 判断选中的是我们的目标Entity
    if (newEntity === movingEntity) {
        const currentCartesian = movingEntity.position.getValue(viewer.clock.currentTime);
        if (currentCartesian) {
            const cartographic = Cesium.Cartographic.fromCartesian(currentCartesian);
            const lat = Cesium.Math.toDegrees(cartographic.latitude).toFixed(6);
            const lng = Cesium.Math.toDegrees(cartographic.longitude).toFixed(6);
            
            // 手动更新描述内容
            movingEntity.description = `
                <div>
                    <h3>移动实体信息</h3>
                    <p>当前纬度：${lat}°</p>
                    <p>当前经度：${lng}°</p>
                </div>
            `;
        } else {
            movingEntity.description = '<p>暂无位置数据</p>';
        }
    }
});

这种方式适合需要和其他交互联动的场景，比如选中时同时触发弹窗、日志记录等操作，再同步更新描述。

小提醒 #

• 如果你的位置是用SampledPositionProperty做时间插值的，一定要用viewer.clock.currentTime来获取对应时间点的位置，这样才能拿到实时动态坐标。
• 转换经纬度时用toFixed(n)控制小数位数，避免显示过长的数字影响可读性。
• 记得判断currentCartesian是否存在，防止Entity还没加载位置时出现报错。

内容的提问来源于stack exchange，提问作者Leeloo