2022-03-10 Cesium实现全球遮罩

2022-03-10  本文已影响0人  MrSwilder

代码比较简单,直接上了

/**
 * 添加遮罩
 */
function addMask() {
  GeoJsonDataSource.load('/data/world.json', {
    clampToGround: true,
    fill: new Color(0 / 255, 0 / 255, 0 / 255, 0.5),
    strokeWidth: 0,
  }).then((dataSource) => {
    maskDataSource = dataSource
    viewer.dataSources.add(dataSource)
    dataSource.entities.values.forEach((entity) => {
      const polygon: any = {
        hierarchy: entity.polygon?.hierarchy?.getValue(JulianDate.now()),
        fill: true,
        material: new Color(0 / 255, 0 / 255, 0 / 255, 0.5),
        classificationType: ClassificationType.TERRAIN,
        stroke: false,
        perPositionHeight: false,
        arcType: ArcType.RHUMB,
        height: 10000,
      }
      entity.polygon = polygon
    })
  })
}

二、遇到的问题
代码很简单,原理就是用全球数据挖个洞,但是如果用数据直接设置全球范围的话只能显示半边,因此需要将源数据拆分为三部分或以上,才能实现,效果如下:


image.png

背面:


image.png
上一篇下一篇

猜你喜欢

热点阅读