笑看天下无敌手 发表于 2024-6-11 08:35:40

Cesium实现加载离线地形数据(nginx发布数据,cesiumLab地形切片数据)

实现效果如图:
https://img-blog.csdnimg.cn/direct/fce77e67bbdb47459dc3f53a75fc7a56.png
详细步骤
1  下载地形数据(DEM)

下载地址:地理空间数据云 (gscloud.cn)
操纵步骤:
https://img-blog.csdnimg.cn/direct/46b26946c64e4b268e538137aff03dc3.png
注意:第3步可以自主选择DEM的分辨率,然后下载。
下载结果解压后如下图:
https://img-blog.csdnimg.cn/direct/d08c0c80dbea4e35ac2e714ec58f3db0.png
2 使用CesiumLab工具对舆图数据进行切片处理

 下载安装CesiumLab,这里就不详细阐明了
  对名称为ASTGTM2_N33E108_dem.tif文件进行切片处理。
操纵步骤:
https://img-blog.csdnimg.cn/direct/43e7c6b89618449a9747b627bb6c9287.png
注意:存储格式选择“散列”。提交后待处理完成
提交处理结果如下图
https://img-blog.csdnimg.cn/direct/abd250ea49604ac787d9804136edaf08.png
3 发布切片数据(两种发布方式任选其一)

方式1、直接在CesiumLab服务发布,操纵如下
https://img-blog.csdnimg.cn/direct/c8f79d604edf47788c1e800c46a2728b.png
得到到终极cesium工程必要的地形url:http://localhost:9003/terrain/ND1oIKj0
方式2、本地nginx发布
   主要是nginx设置切片数据所在目录进行分发设置nginx.conf,设置方式如下:
server {
                listen                        9005;
                server_name                127.0.0.1;
                # 这里需要写相对路径绝对路径会报错404
                root                         ../terrain;
                autoindex                 on;
                location / {
                # 支持跨域
          add_header Access-Control-Allow-Origin *;
      add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
      add_header 'Access-Control-Allow-Headers' 'DNT,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Range';
      add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range';
                }
                # 不存缓存 每次重新验证
                add_header Cache-Control "no-cache,must-revalidate";
    } 得到到终极cesium工程必要的地形url:http://127.0.0.1:9005
4 cesium工程引用实现地形效果

// 加载地形
function loadDingx(type) {
var url;
   url = "http://localhost:9005/";
// url = "http://localhost:9003/terrain/ND1oIKj0"
if (url != null) {
    if (type == 0) {
      viewer.terrainProvider = new Cesium.EllipsoidTerrainProvider();
    } else {
      var terrainProvider = new Cesium.CesiumTerrainProvider({
      url: url,
      requestVertexNormals: true,
      requestWaterMask: true ,
      tilingScheme: new Cesium.GeographicTilingScheme(),
      requestVertexNormals:true

      });
      viewer.terrainProvider = terrainProvider;
    }
}
} 到此就竣事了!

免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
页: [1]
查看完整版本: Cesium实现加载离线地形数据(nginx发布数据,cesiumLab地形切片数据)