Cesium entity加載了 500 個飛機模型(同一個模型)，50ms 改變一次坐標，幀率保持在 27FPS 左右衬吆。

image.png

<template>
    <div id="cesiumContainer"></div>
</template>

<script>
export default {
    name: "MultModel",
    mounted() {
        this.initViewer();
        this.loadModel();
        this.changePos();
    },
    methods: {
        initViewer() {
            let defaultRect = Cesium.Rectangle.fromDegrees(90, 20, 130, 50);
            Cesium.Camera.DEFAULT_VIEW_RECTANGLE = defaultRect;
            window.viewer = new Cesium.Viewer("cesiumContainer", {
                animation: false,
                shouldAnimate: true,
                baseLayerPicker: false,
                fullscreenButton: false,
                geocoder: false,
                homeButton: false,
                sceneModePicker: false,
                selectionIndicator: false,
                timeline: false,
                navigationHelpButton: false,
                infoBox: false,
                navigationInstructionsInitiallyVisible: false,
                imageryProvider: new Cesium.UrlTemplateImageryProvider({
                    url: "https://webst01.is.autonavi.com/appmaptile?style=6&x={x}&y={y}&z={z}",
                }),
            });
            window.viewer.scene.debugShowFramesPerSecond = true;
        },
        loadModel() {
            for (let i = 0; i < 500; i++) {
                let lon = 110 + Math.random() / 10;
                let lat = 30 + Math.random() / 10;
                let entity = viewer.entities.add({
                    id: i,
                    position: Cesium.Cartesian3.fromDegrees(lon, lat, 100),
                    model: {
                        uri: "data/Cesium_Air.glb",
                        scale: 20,
                        color: Cesium.Color.fromRandom(),
                    },
                });
            }
            viewer.camera.flyTo({
                destination: Cesium.Cartesian3.fromDegrees(110, 30, 5000),
            });
        },
        changePos() {
            setTimeout(() => {
                setInterval(() => {
                    for (let i = 0; i < 500; i++) {
                        let entity = viewer.entities.getById(i);
                        let carto = Cesium.Cartographic.fromCartesian(entity.position.getValue());
                        let lon = Cesium.Math.toDegrees(carto.longitude);
                        let lat = Cesium.Math.toDegrees(carto.latitude);
                        let height = carto.height;
                        lon = lon + Math.random() / 1000;
                        lat = lat + Math.random() / 1000;
                        entity.position = Cesium.Cartesian3.fromDegrees(lon, lat, height);
                    }
                }, 50);
            }, 6000);
        },
    },
};
</script>

<style>

</style>