1. 代码核心功能备注解析

模块一：地图初始化 (initMap)

模块二：底图加载 (initBaseLayer)

模块三：数据渲染与交互

• addGeoJsonSingleLayer: 加载 GeoJSON 数据（如行政区划边界）。支持多边形（Polygon）填充和轮廓，以及线（Polyline）的虚线/实线样式。

• addPrimitivePointsLayer: 高性能点位渲染。它没有使用 Entity API，而是直接操作底层的 Primitive（BillboardCollection 和 LabelCollection），适合渲染成千上万个点位。

• getMousePosition: 监听鼠标移动，将屏幕坐标（Cartesian2）转换为经纬度，用于页面左下角显示坐标信息。

• initMapLeftClick: 监听左键点击，获取点击对象的 ID，并更新到 Pinia Store (spaceStore) 中，用于业务联动。

2. 代码功能罗列

1. 地图容器初始化：构建一个精简的、无默认控件的 3D 地球场景。

2. 多源底图叠加：支持通过 WMTS 协议加载天地图底图和注记图层。

3. 视图控制：
• 限制了用户的最大缩放高度。
• 自定义了鼠标的操作习惯（缩放、倾斜按键映射）。
• 提供 setCameraByLonLatHeight 函数用于代码控制相机视角飞向指定位置。

4. 矢量数据可视化 (GeoJSON)：
• 绘制行政区划面（支持透明度、填充色）。
• 绘制边界线（支持实线、虚线配置）。

5. 海量点位标记 (Primitives)：
• 通过 Primitive 方式高性能渲染图标（Billboard）和文字（Label）。
• 支持避让逻辑（防遮挡）和按距离显示。

6. 交互反馈：
• 实时显示鼠标所在位置的经纬度。
• 点击地图要素触发业务逻辑（更新 Store）。

7. 异步加载保障：提供了 getViewerAsync 和 getTileLoadedAsync 方法，确保在外部调用地图 API 时，地图核心对象已经初始化完成。

3. 地图出现的关键因素

第一关键：DOM 容器的宽高 (id="mapLocation")

第二关键：initMap 的调用与 Viewer 创建

• 如果没有这一步，Cesium 可能会尝试加载默认的 Bing Map，如果没有配置 Bing Token，可能会报错或显示红叉，或者显示默认的深蓝色星空球。

• 现在的配置下，执行完这一步，你只会看到一个纯白色的球体。

第三关键：initBaseLayer 的 URL 配置 (真正的地图纹理)

1. 代码读取了 environment.VITE_TIAN_DI_TU_MAP。

2. Token 是否有效：天地图现在需要 Key (Token)。如果环境变量中的 URL 没有带 Key 或者 Key 失效，请求会报 403 错误，球体依然是白色的，或者出现网格加载失败。

3. 此函数向白色球体上覆盖了真正的地图瓦片。

总结流程

1. Vue 挂载 (onMounted) -> 等待 DOM 更新 (nextTick)。

2. initMap: 创建 Canvas，画出一个白色的球。

3. initBaseLayer: 向白色球上贴上天地图的瓦片图片。

4. setCamera...: 将相机从太空视角瞬间拉到重庆上空 (longitude, latitude 配置)，让你看到具体的地图细节。