update：添加天空盒场景

src/examples/CodeMap.js

@@ -31,6 +31,7 @@ import vueCodeJingweiNetwork2D from '@/examples/sceneSet/jingweiNetwork2D/jingwe
 import vueCodeCircularSpaceGrid from '@/examples/sceneSet/circularSpaceGrid/circularSpaceGrid.vue?raw'
 import vueCodeRectangularSpaceGrid from '@/examples/sceneSet/rectangularSpaceGrid/rectangularSpaceGrid.vue?raw'
 import vueCodeEarthCoordinate from '@/examples/sceneSet/earthCoordinate/earthCoordinate.vue?raw'
+import vueCodeSkyBox from '@/examples/sceneSet/skyBox/skyBox.vue?raw'
 import vueCodeMapx from '@/examples/sceneSet/mapx/mapx.vue?raw'
 
 // 天气
@@ -75,6 +76,7 @@ const vueCodeMap = {
     圆形空间网格: vueCodeCircularSpaceGrid,
     矩形空间网格: vueCodeRectangularSpaceGrid,
     地球坐标系: vueCodeEarthCoordinate,
+    天空盒: vueCodeSkyBox,
     鹰眼图: vueCodeMapx,
 
     // 天气

src/examples/FunctionMap.js

@@ -31,6 +31,7 @@ import functionCodeJingweiNetwork2D from '@/examples/sceneSet/jingweiNetwork2D/j
 import functionCodeCircularSpaceGrid from '@/examples/sceneSet/circularSpaceGrid/circularSpaceGrid-function.js?raw'
 import functionCodeRectangularSpaceGrid from '@/examples/sceneSet/rectangularSpaceGrid/rectangularSpaceGrid-function.js?raw'
 import functionCodeEarthCoordinate from '@/examples/sceneSet/earthCoordinate/earthCoordinate-function.js?raw'
+import functionCodeSkyBox from '@/examples/sceneSet/skyBox/skyBox-function.js?raw'
 import functionCodeMapx from '@/examples/sceneSet/mapx/mapx-function.js?raw'
 
 // 天气
@@ -74,6 +75,7 @@ const functionCodeMap = {
     圆形空间网格: functionCodeCircularSpaceGrid,
     矩形空间网格: functionCodeRectangularSpaceGrid,
     地球坐标系: functionCodeEarthCoordinate,
+    天空盒: functionCodeSkyBox,
     鹰眼图: functionCodeMapx,
 
     // 天气

src/examples/sceneSet/skyBox/skyBox-function.js

+export function addSkyBox() {
+    const script = document.createElement('script');
+    script.src = 'https://cesium.com/downloads/cesiumjs/releases/1.99/Build/Cesium/Cesium.js';
+    script.onload = () => {
+        window.Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI3Njg4ZWU5Yi1iZDhiLTRhYmUtOTRiYS04YjM5NmUwNjVmMDMiLCJpZCI6MjI3MzQ3LCJpYXQiOjE3MjA1MjA4Mjh9.E5XW4LnwgfVAaBC-znaYr61m4yK0-j2qEQhi9qwFFPE'
+
+        const viewer = new window.Cesium.Viewer('cesiumContainer', {
+            infoBox: false,
+        });
+
+        // 定义图片的URL
+        const imageUrls = {
+            positiveX: 'https://raw.githubusercontent.com/jinlinchao123/Cesium-assets/main/tycho2t3_80_px.jpg',
+            negativeX: 'https://raw.githubusercontent.com/jinlinchao123/Cesium-assets/main/tycho2t3_80_mx.jpg',
+            positiveY: 'https://raw.githubusercontent.com/jinlinchao123/Cesium-assets/main/tycho2t3_80_py.jpg',
+            negativeY: 'https://raw.githubusercontent.com/jinlinchao123/Cesium-assets/main/tycho2t3_80_my.jpg',
+            positiveZ: 'https://raw.githubusercontent.com/jinlinchao123/Cesium-assets/main/tycho2t3_80_pz.jpg',
+            negativeZ: 'https://raw.githubusercontent.com/jinlinchao123/Cesium-assets/main/tycho2t3_80_mz.jpg',
+        };
+
+        // 异步加载图片
+        async function loadImages() {
+            const sources = {};
+            for (const [key, url] of Object.entries(imageUrls)) {
+                const response = await fetch(url);
+                const blob = await response.blob();
+                const imageUrl = URL.createObjectURL(blob);
+                sources[key] = imageUrl;
+            }
+            return sources;
+        }
+
+        // 设置SkyBox
+        loadImages().then(sources => {
+            viewer.scene.skyBox = new Cesium.SkyBox({
+                sources: sources
+            });
+        });
+        
+    };
+    document.head.appendChild(script);
+
+    const link = document.createElement('link');
+    link.rel = 'stylesheet';
+    link.href = 'https://cesium.com/downloads/cesiumjs/releases/1.119/Build/Cesium/Widgets/widgets.css';
+    document.head.appendChild(link);
+}

src/examples/sceneSet/skyBox/skyBox.vue

+<template>
+    <div id="cesiumContainer" class="cesium-container"></div>
+</template>
+<script setup>
+import { onMounted } from 'vue';
+import { addSkyBox } from './function';
+onMounted(() => {
+    addSkyBox()
+});
+</script>
+
+<style>
+.cesium-container {
+width: 100%;
+height: 100vh;
+}
+</style>
\ No newline at end of file

src/views/ElementMap.js

@@ -112,6 +112,10 @@ export const elementSceneSetMap = {
         title: '地球坐标系',
         pngUrl: '/src/assets/EarthCoordinate.png'
     },
+    天空盒: {
+        title: '天空盒',
+        pngUrl: '/src/assets/SkyBox.png'
+    },
     鹰眼图: {
         title: '鹰眼图',
         pngUrl: '/src/assets/Mapx.png'