Cesium淹没分析（干货）

_JinHao

已于 2025-02-20 16:25:45 修改

阅读量4.7k

点赞数 2

CC 4.0 BY-SA版权

分类专栏：三维可视化文章标签：可视化

于 2021-08-12 09:55:49 首次发布

本文链接：https://blog.youkuaiyun.com/weixin_44716194/article/details/119632643

三维可视化专栏收录该内容

2 篇文章

订阅专栏

本文介绍了如何使用Cesium进行淹没分析，包括初始化设置、地形深度检测、时间模拟及淹没范围设定。通过示例代码展示了如何动态展示水位上升过程，并创建水面效果，为地理信息领域的淹没模拟提供了一个实用的参考。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Cesium淹没分析

效果图

淹没分析主要研究的是某一块指定的研究的区域，根据当前地表起伏（也可以依据三维模型），动态展示不同时刻、区域、水深、流速等的淹没可视化结果。

需要具备的参数：淹没范围的设定，水面上升速度；

具体步骤

1、cesium的初始化

let tiandituTk='你的tk';
let subdomains=['0','1','2','3','4','5','6','7'];
let viewer = new Cesium.Viewer('cesiumContainer', {
  imageryProvider: new Cesium.WebMapTileServiceImageryProvider({
      //影像底图
      url: "http://t{s}.tianditu.com/img_w/wmts?service=wmts&request=GetTile&version=1.0.0&LAYER=img&tileMatrixSet=w&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}&style=default&format=tiles&tk="+tiandituTk,
      subdomains: subdomains,
      layer: "img",
      style: "default",
      format: "tiles",
      tileMatrixSetID: "w",
      show: true
  }),
  terrainProvider: Cesium.createWorldTerrain({
      requestVertexNormals: true,
      requestWaterMask: true
  })
});

2、核心代码

viewer.scene.globe.depthTestAgainstTerrain = true;   // 地形深度检测
viewer.clock.shouldAnimate = true;   // 时间开启
// 设置模拟时常
viewer.clock.startTime = Cesium.JulianDate.fromIso8601(
	"2021-08-01T00:00:00.00Z"
);
viewer.clock.stopTime = Cesium.JulianDate.fromIso8601(
	"2021-08-01T00:10:00.00"
);
viewer.clock.clockRange = Cesium.ClockRange.LOOP_STOP; // 反复循环
viewer.clock.multiplier = 10; // 时间倍速

// 范围拟定
let extent = [
  {
    lat: 117.897,
    lng: 35.009,
    hgt: -131.5,
  },
  {
    lat: 117.91,
    lng: 35.011,
    hgt: -121,
  },
  {
    lat: 117.924,
    lng: 34.998,
    hgt: -123,
  },
  {
    lat: 117.908,
    lng: 34.991,
    hgt: -108,
  },
  {
    lat: 117.905,
    lng: 34.992,
    hgt: -106,
  },
  {
    lat: 117.899,
    lng: 34.998,
    hgt: -130,
  },
];

let currentTime = Cesium.JulianDate.fromIso8601(
	"2020-08-01T00:00:00.00Z"
);
let height = 100;
let propertyTime = new Cesium.TimeIntervalCollectionProperty(Number);
// 设置时间循环
for (var i = 0; i <= 600; i++) {
  let addTime = Cesium.JulianDate.addSeconds(
    currentTime ,
    i,
    new Cesium.JulianDate()
  );

  let nxtTime = Cesium.JulianDate.addSeconds(
    currentTime ,
    i + 1,
    new Cesium.JulianDate()
  );

  let stopFlg = false;
  if (i == 600) {
    nxtTime = addTime.clone();
    stopFlg = true;
  }
  height = height + 0.1;

  propertyTime.intervals.addInterval(
    new Cesium.TimeInterval({
      start: addTime,
      stop: nxtTime,
      isStartIncluded: true,
      isStopIncluded: stopFlg,
      data: height,
    })
  );
}

// 面实体添加
viewer.entities.add({
  polygon: {
    hierarchy: Cesium.Cartesian3.fromDegreesArray(extent),
    perPositionHeight: true,
    extrudedHeight: propertyTime,
    // 设置图片的样式
    material:
    new Cesium.ImageMaterialProperty({
      image: this.folderUrl + "/images/water.png",
      repeat: Cesium.Cartesian2(1.0, 1.0), // 不重复
      transparent: true, // 启用png透明
      color: Cesium.Color.WHITE.withAlpha(0.5),
    }),
  },
});