Cesium加载二三维空间数据的实现

本文总结 Cesium.js 中常见的二、三维数据加载实现方式，并给出可复制的最小示例。若你提供具体数据 URL，我也可以帮你直接改成可运行代码。

---

0. 基础准备：创建 Viewer

最小初始化（假设你已正确引入 CesiumJS 资源并拥有一个容器 div#cesiumContainer）

// 创建 Viewer（根据需要配置地形、影像等）
const viewer = new Cesium.Viewer('cesiumContainer', {
   
   
  // imageryProvider、terrainProvider 可按需设置
  timeline: false,
  animation: false,
});

---

1）加载 2D 矢量数据

1.1 GeoJSON / TopoJSON

• API：GeoJsonDataSource.load(urlOrData, options)，支持 simplestyle 样式属性，便于快速设色标注 [ref:11]
• 常用点：加载是异步的，返回 Promise；完成后可 viewer.zoomTo(dataSource) 定位到数据范围 [ref:11]

示例（点/线/面统一处理）

// 1) 远程或本地 GeoJSON 地址，也可以直接传对象
const geojsonUrl = 'https://example.com/data.geojson';

// 2) 可选：默认样式（点、线、面）
const options = {
   
   
  clampToGround: true,        // 贴地（需要地形支持才有效）
  markerColor: Cesium.Color.RED,
  stroke: Cesium.Color.YELLOW,
  fill: Cesium.Color.fromCssColorString('#00FF0066'), // 半透明填充
};

// 3) 加载
Cesium.GeoJsonDataSource.load(geojs