Cesium实践（2）—— 加载地形与影像-Toy模板网

这篇具有很好参考价值的文章主要介绍了Cesium实践（2）—— 加载地形与影像。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

前言

地形数据用来表示真实的地形起伏；地图数据指的则是真实的影像服务，本文实践在Cesium中加载地形与影像数据。

地形数据

Cesium地形服务

地形服务是Cesium的亮点之一，通过加入地形可以形象的展示出地球表面凹凸起伏。如果要使用地形服务的话，在创建Viewer时指定 terrainProvider 即可，注意地形数据是不可叠加的。

Cesium.createWorldTerrain

当添加了默认 token 后，可以使用 Cesium.createWorldTerrain 添加Cesium自带的地形服务，不需要额外指定请求的url：

  const viewer = new Cesium.Viewer("cesium", {
    infoBox: false,
    
    // 地形服务
    terrainProvider: Cesium.createWorldTerrain({
      requestVertexNormals: true, //开启地形光照
      requestWaterMask: true, // 开启水面波纹
    }),

  });

下图是加载地形数据后西藏部分地区的地形
cesiumterrainprovider加自定义地形,WebGIS,# Cesium,webgis,cesium
查看请求的话发现地形数据是以矢量瓦片的格式进行请求的，cesium引擎在获取数据后基于webgl进行渲染

其它地形服务

Cesium还支持一些其它厂商的开源地形服务，如：谷歌地球的高程数据、VR-TheWorld Server的高程数据、光滑椭球体。

谷歌地球高程数据：需要指定url和元数据
VR-TheWorld Server高程数据：需要指定url
谷歌地球高程数据：默认无高度

    // 使用谷歌地球的高程数据
    terrainProvider: Cesium.GoogleEarthEnterpriseTerrainProvider({
      url: "http://www.example.com",
      metadata: metaOptions,
    }),
    
    // 使用 VR-TheWorld Server的高程数据
    terrainProvider: Cesium.VRTheWorldTerrainProvider({
      url: "http://www.example.com",
    }),

    // 使用 光滑椭球体(默认无高度)
    terrainProvider: Cesium.EllipsoidTerrainProvider(),

自定义高程数据

Cesium支持加载自定义的高程数据，一般是通过 DEM数字高程模型，借助 Cesium Lab 转换为Cesium支持的地形数据格式，然后使用 Cesium.CesiumTerrainProvider 这个 API 进行加载，DEM数据可以从地理空间数据云下载，对于遥感相关专业的人来讲它的重要性相当于 Git Hub 之于计科，是下载遥感数据最常用的网站。

	// 自定义地形服务
     terrainProvider: new Cesium.CesiumTerrainProvider({
       url: "xxx",
    }),

完整的使用教程网上有很多，这里不再详细介绍，可参考Cesium 地形数据的加载

影像数据

加载影像数据

Cesium默认使用微软的Bing影像图，在Viewer类中使用 imageryProvider 函数可初始化图层，加载高德栅格瓦片地图：

	// gd
    imageryProvider: new Cesium.UrlTemplateImageryProvider({
      url: "http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}",
      layer: "GDLayer",
      style: "default",
      format: "image/png",
      tileMatrixSetID: "GoogleMapsCompatible",
    }),

或者

	const layers = viewer.scene.imageryLayers;
 	layers.addImageryProvider(
    	new Cesium.UrlTemplateImageryProvider({
      		url: "http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=8&x={x}&y={y}&z={z}",
      		layer: "GDLayer",
      		style: "default",
      		format: "image/png",
      		tileMatrixSetID: "GoogleMapsCompatible",
    	})
    )

cesiumterrainprovider加自定义地形,WebGIS,# Cesium,webgis,cesium

ImageryProvider 支持的地图服务

Cesium支持加载 TMS WMS WMTS 等多个标准的地图服务，同时也提供了支持多种服务的接口，API文档：Cesium.ImageryProvider()，下面列举一些常用的接口。

API	说明
WebMapServiceImageryProvider	网络地图服务WMS，OGC标准影像数据服务之一，用于从分布式地理空间数据库请求地理区域的地图块
TileMapServiceImageryProvider	瓦片地图服务TMS ，REST风格的瓦片服务，可使用Map Tiler 或 GDAL2Tiles 生成瓦片
WebMapTileServiceImageryProvider	网络地图瓦片WMTS，OGC标准影像数据服务之一，通过网络提供预先渲染的地理参考地图瓦片
OpenStreetMapImageryProvider	调用 Open Street Map 在线地图或者 Slippy 地图切片
BingMapsImageryProvider	调用 Bing 地图网络服务
ArcGisMapServerImageryProvider	调用 ArcGis Server 发布的瓦片服务
GoogleEarthEnterpriseImageryProvider；GoogleEarthEnterpriseMapsProvider	调用 Google Earth 发布的影像或地图服务
MapboxImageryProvider；MapboxStyleImageryProvider	调用 Mapbox API 发布的各种数据服务，需要提前申请令牌
SingleTileImageryProvider	加载一张全球图片作为底图
UrlTemplateImageryProvide	可连接至各种地图原，参考 UrlTemplateImageryProvider