cesium缩放地图不改变地图上椭圆显示大小 完整代码

Cesium是一个开源的JavaScript库，用于创建交互式3D地球浏览器。如果你想要缩放地图而不改变地图上表示特定区域的椭圆显示大小，你需要在处理缩放事件时，对这些椭圆（通常代表经纬度范围的视图区域）的大小保持独立。

下面是一个简化的Cesium示例代码片段，展示了如何在缩放地图时保持椭圆显示大小不变：

// 创建一个cesium Viewer实例
var viewer = new Cesium.Viewer('mapContainer', {
    imageryProvider: Cesium.createWorldImagery(),
});

// 获取地图的平移和旋转中心点，通常这是当前视图的中心
function getCenter(viewState) {
    var center = viewer.camera.getCenter();
    return Cesium.Cartesian3.fromDegrees(center.x, center.y);
}

// 当用户缩放地图时，更新椭圆边界但保持其大小
viewer.scene.globe.depthTestAgainstTerrain = false; // 禁止地形影响深度测试

viewer.scaleChanged.addEventListener(function(scale) {
    var extentBefore = viewer.imageryLayers[0].tileBoundingSphere;
    var centerBefore = getCenter(viewer.camera);

    // 缩放比例计算新的视野范围，但保持椭圆大小不变
    var extentAfter = Cesium.Rectangle.fromCartographicCoordinates(
        extentBefore.innerWest,
        extentBefore.outerSouth,
        extentBefore.innerEast,
        extentBefore.outerNorth
    );

    // 设置新的椭圆边界
    viewer.camera.setView({
        destination: Cesium.Cartesian3.fromRectangle(extentAfter, viewer.conversion.easternHemisphere),
        endTransform: Cesium.Matrix4.IDENTITY, // 保持当前位置
        duration: 0, // 非动画效果
    });

    // 更新地图中心，使其仍在椭圆中心位置
    viewer.camera.move({
        destination: centerBefore,
        endTransform: Cesium.Matrix4.IDENTITY,
        easingFunction: Cesium.Easing.linear(),
        complete: function() {},
    });
});