Cesium实现带经纬度的自定义定位标记及Sandcastle报错解决

• Sandcastle是Cesium官方沙盒平台专属的全局工具对象，仅在其在线编辑器环境中存在，本地HTML页面没有内置该对象，直接删除所有Sandcastle.declare()相关代码即可，不影响核心功能实现。

你要的效果可以通过定位图标+带背景框的经纬度标签组合实现，以下是可直接复用的修改方案：

1. 先把你原有代码顶部的let label;替换为let markerEntity;
2. 替换原有的fly函数为以下代码：

function fly(position) {
    const lat = position.coords.latitude.toFixed(6);
    const lng = position.coords.longitude.toFixed(6);
    const positionCartesian = Cesium.Cartesian3.fromDegrees(position.coords.longitude, position.coords.latitude);
    
    // 移除已存在的旧标记
    if(markerEntity){
        viewer.entities.remove(markerEntity);
    }
    
    // 添加自定义组合标记
    markerEntity = viewer.entities.add({
        position: positionCartesian,
        // 定位图标，可替换为你自己的图标地址
        billboard: {
            image: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH5gMVESkq6kOvtwAAAGlJREFUSMft1LsRQFAQheHPowAKoACx3IgEKtaEHujDjORSgWTH/ZOdnZOcM/sgk/kY8xWcH3VnQkqMyoVZud5SZw6EqbR/9xlZVOjdcSTgC7xuTKTwKyrfXKtC9yxxYVaFWcCFU0Eam4BYgKrfUgFyiC9gAAAAASUVORK5CYII=',
            width: 32,
            height: 32,
            pixelOffset: new Cesium.Cartesian2(0, -16),
            verticalOrigin: Cesium.VerticalOrigin.BOTTOM
        },
        // 带背景框的经纬度标签
        label: {
            text: `Lat: ${lat}\nLng: ${lng}`,
            font: '14px sans-serif',
            fillColor: Cesium.Color.WHITE,
            outlineColor: Cesium.Color.BLACK,
            outlineWidth: 2,
            pixelOffset: new Cesium.Cartesian2(0, -50),
            showBackground: true,
            backgroundColor: new Cesium.Color(0, 0, 0, 0.7),
            backgroundPadding: new Cesium.Cartesian2(8, 4),
            horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
            verticalOrigin: Cesium.VerticalOrigin.BOTTOM
        }
    });

    // 相机飞到对应位置
    viewer.camera.flyTo({
        destination: Cesium.Cartesian3.fromDegrees(
            position.coords.longitude,
            position.coords.latitude,
            1005.0
        ),
    });
}

注意：你原有代码的label text行末尾多了一个多余的引号，会导致语法报错，替换为上述代码即可解决。
可以自行调整billboard的尺寸、偏移，label的字体、颜色、背景透明度等参数匹配你需要的样式。

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