cesium【03-图层】
一、初始化图层参数：
imageryProvider：图层资源，baseLayerPicker为false才有效
terrainProvider：地形资源
let container = 'cesiumContainer' let options = { baseLayerPicker:false,//默认true,图层选择器，右上角 //图层资源，baseLayerPicker为false才有效 imageryProvider:new Cesium.UrlTemplateImageryProvider({ url:'http://t2.tianditu.gov.cn/img_w/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=img&STYLE=default&TILEMATRIXSET=w&FORMAT=tiles&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}&tk=b0b6f6127490e1226b057bf3e90dfa45',//用于请求图块的URL模板 subdomains:'abc',//子域名 tileWidth:256,//图像图块的可选像素宽度。 tileHeight:256,//图像图块的可选像素高度。 }), //地形资源 terrainProvider:new Cesium.CesiumTerrainProvider({ url:'https://terrain.gbim360.com/',//地形服务 requestVertexNormals:true,//用于指示客户端是否应从服务器请求其他照明信息 }) } let viewer = new Cesium.Viewer(container, options)
二、初始化之后图层的操作：
/** * 添加图层 * imageryProvider:图层资源 * index:添加图层的索引。如果省略，该图层将添加到所有现有图层的顶部 */ viewer.imageryLayers.addImageryProvider(imageryProvider,index) /** *删除某一个图层 * layer:要删除的图层对象 */ viewer.imageryLayers.remove(layer) /** * 删除所有图层 */ viewer.imageryLayers.removeAll() /** * 销毁所有图层 */ viewer.imageryLayers.destroy()
更多操作技巧请查看上图中的API
三、常用图层资源类型
//图层资源 function imageryProviderFn(type){ let layers; if(type === 'ArcGIS'){ //ArcGIS layers = new Cesium.ArcGisMapServerImageryProvider({ url:'',//ArcGIS MapServer服务的URL。 token:'',//ArcGIS令牌，用于通过ArcGIS MapServer服务进行身份验证。 tileWidth:256,//瓦片宽度，默认值 tileHeight:256,//瓦片高度，默认值 }) }else if(type === 'BingMaps'){ //Bing Maps let bingStyle = { 'AERIAL':Cesium.BingMapsStyle.AERIAL,//航空影像 'DEMAND':Cesium.BingMapsStyle.AERIAL_WITH_LABELS_ON_DEMAND,//与路覆盖的航拍图像 'DARK':Cesium.BingMapsStyle.CANVAS_DARK,//路线图的深色版本。 'GRAY':Cesium.BingMapsStyle.CANVAS_GRAY,//路线图的灰度版本 'LIGHT':Cesium.BingMapsStyle.CANVAS_LIGHT,//路线图的较浅版本 'BART':Cesium.BingMapsStyle.COLLINS_BART,//柯林斯·巴特的影像 'SURVEY':Cesium.BingMapsStyle.ORDNANCE_SURVEY,//军械测量图像。该图像仅在英国伦敦地区可见 'ROAD_ON_DEMAND':Cesium.BingMapsStyle.ROAD_ON_DEMAND,//没有其他图像的道路 } layers = new Cesium.BingMapsImageryProvider({ url:'',//图层资源 key:'',// Bing Maps密钥 mapStyle:bingStyle.DEMAND,//Bing图像的类型。 }) }else if(type === 'OSM'){ //OpenStreetMap layers = new Cesium.OpenStreetMapImageryProvider({ url : 'https://a.tile.openstreetmap.org/',//图层资源 }) }else if(type === 'TMS'){ //提供由MapTiler，GDAL2Tiles等生成的切片图像的图像提供程序 layers = new Cesium.TileMapServiceImageryProvider({ url : '../images/cesium_maptiler/Cesium_Logo_Color',//服务器上图像切片的可选路径 fileExtension: 'png',//服务器上图像的文件扩展名 rectangle: new Cesium.Rectangle(//图像覆盖的矩形(以弧度表示)，默认是最大值 Cesium.Math.toRadians(-120.0), Cesium.Math.toRadians(20.0), Cesium.Math.toRadians(-60.0), Cesium.Math.toRadians(40.0) ) }) }else if(type === 'Mapbox'){ //Mapbox layers = new Cesium.MapboxImageryProvider({ url:'',//Mapbox服务器网址 mapId: 'mapbox.streets',//Mapbox地图ID accessToke:'thisIsMyAccessToken',//图像的公共访问令牌 format:'png',//图像请求的格式 rectangle: new Cesium.Rectangle(//图像覆盖的矩形(以弧度表示),默认是最大值 Cesium.Math.toRadians(-120.0), Cesium.Math.toRadians(20.0), Cesium.Math.toRadians(-60.0), Cesium.Math.toRadians(40.0) ) }) }else if(type === 'IMAGE'){ //提供单个顶层图像图块 layers = new Cesium.SingleTileImageryProvider({ url:'',//地址 rectangle: new Cesium.Rectangle(//图像覆盖的矩形(以弧度表示),默认是最大值 Cesium.Math.toRadians(-120.0), Cesium.Math.toRadians(20.0), Cesium.Math.toRadians(-60.0), Cesium.Math.toRadians(40.0) ) }) }else if(type === 'XYZ'){ //XYZ,通过使用指定的URL模板请求图块来提供图像。 layers = new Cesium.UrlTemplateImageryProvider({ url:'',//用于请求图块的URL模板 subdomains:'abc',//子域名 tileWidth:256,//图像图块的可选像素宽度。 tileHeight:256,//图像图块的可选像素高度。 }) }else if(type === 'WMS'){ //WMS layers =new Cesium.WebMapServiceImageryProvider({ url:'',//WMS服务的URL layers:'layers',//地图图层名称 parameters:{ version:'1.3.0',//wms版本 format:'image/png',//地图请求参数类型 },//附加参数，用于通过GetMap URL传递到WMS服务器。 tileWidth:256,//图像图块的可选像素宽度。 tileHeight:256//图像图块的可选像素高度。 }) }else if(type === 'WMTS'){ //WMTS layers = new Cesium.WebMapTileServiceImageryProvider({ url:'',//WMTS服务的URL format:'image/jpeg',//MIME类型,用于从服务器检索图像 layer:'USGSShadedReliefOnly',//WMTS请求的层名称 style:'default',//WMTS请求的样式名称 tileMatrixSetID :'default028mm',//用于WMTS请求的TileMatrixSet的标识符 tileWidth:256,//图像图块的可选像素宽度 tileHeight:256,//图像图块的可选像素高度 }) } return layers; }
四、常用地形资源类型
//地形 function terrainProviderFn(type){ let terrain; if(type === 1){ //谷歌地形高度图（height map）方式生成地形 terrain = Cesium.GoogleEarthEnterpriseTerrainProvider({ url:'',//地形资源 }) }else if(type ===2){ //光滑椭球体。这个地形不请求任何服务数据，也没有任何地形起伏效果。一般用作一些太空类展示项目 terrain = new Cesium.EllipsoidTerrainProvider({ ellipsoid:Cesium.Ellipsoid.WGS84 }) }else if(type ===3){ //高经度全球地形，地形支持光照和水面效果 terrain = new Cesium.CesiumTerrainProvider({ url:'https://terrain.gbim360.com/',//地形服务 requestVertexNormals:true,//用于指示客户端是否应从服务器请求其他照明信息 }) }else if(type ===4){ //这个服务数据是90米采样精度的全球数据，并且包含水深数据 terrain = new Cesium.VRTheWorldTerrainProvider({ url:'', }) } return terrain; }
