接触到的加载数据类型:源地图、shp、Geojson、png、wms、地形底图
1、Cesium加载各类源地图(在线的影像服务)
#此类加载的本质在于 new Cesium.ImageryProvider()
Api defination:“Provides imagery to be displayed on the surface of an ellipsoid. This type describes an interface and is not intended to be instantiated directly.”
imagerProvider不能直接实例化,必须使用具体的接口
var viewer = new Cesium.Viewer("cesiumContainer",
{imageryProvider:new Cesium.加载数据方式{
url:加载数据类型}),
其他控件设置
});
#加载在线影像服务的方式主要包括:
ArcGisMapserverImageryProvider - Arcgis地图服务
BingMapsImageryProvider - BIngMaps地图服务
createOpenStreetMapImageryProvider
createTileMapServiceImageryProvider -提供已发布的瓦片格式(provides tiled imagery as generated by MapTiler, GDAL2Tiles, etc.)
地图加载:TMS、GDAL2Tiles处理后的发布数据
GoogleEarthEnterpriseImageryProvider -Provides tiled imagery using the Google Earth Enterprise REST API
singleTileImageryProvider -单一瓦片加载方式
TileCoordinationImageryProvider - 常用于地形加载
UrlTemplateImageryProvider -url模版的影像服务加载,较为常用的方式,
api中url : ‘https://cesiumjs.org/tilesets/imagery/naturalearthii/{z}/{x}/{reverseY}.jpg‘以及其他地图的api地址
WebMapServiceImageryProvider:Provides tiled imagery hosted by a Web Map Service (WMS) server.
提供瓦片化的wms服务
WebMapTilesServiceImageryProvider:提供一种兼容性的瓦片wms服务
#追加地图服务:
var addlayer = viewer.scene.imagerlayers;Imagerylayers影像图层容器
var newmap = addlayer.addImageryProvider(new Cesium.UrlTemplateImageryProvider({url:地址},其他设置);
可以对newmap 设置透明度、亮度等:newmap.alpha(0透明,1不透明),newmap.brightness(>1增加亮度,<1降低亮度)
#追加个别影像
var specilaMap = addlayer.addImageryProvider(new Cesium.SingleTileImageryProvider(
{url:....png},
rectangle:cesium.rectangle.fromDegrees(111,31,113,33))//放置范围
#官方的ImageryProvider详细说明:
Cesium内置以下ImageryProvider:
- Web Map Service (WMS) – OGC标准,用于从分布式地理空间数据库中请求地理区域的地图块。在Cesium中,请参见WebMapServiceImageryProvider。
- Tile Map Service (TMS) – 访问瓦片图的Rest接口。瓦片图被转换为MapTiler或GDAL2Tiles.参见TileMapServiceImageryProvider。
- OpenGIS Web Map Tile Service (WMTS) – 一个OGC标准,用于在互联网上提供预先绘制的地理参考瓦片图。在Cesium中,请参见WebMapServiceImageryProvider。
- OpenStreetMap – 访问OpenStreetMap瓦片图或任何Slippy瓦片图。有几种方式可以host these tiles 在Cesium中,请参加createOpenStreetMapImageryProvider。
- Bing Maps – 使用Bing Maps REST Services访问瓦片图。 在https://www.bingmapsportal.com/创建Bing地图的keys。在Cesium中, 请参见BingMapsImageryProvider。
- Esri ArcGIS MapServer – 使用ArcGIS Server REST API来访问ArcGIS MapServer上的瓦片图. 在Cesium中,请参见ArcGisMapServerImageryProvider。
- Google Earth Enterprise – 提供对存储Google Earth Enterprise服务器中的图层的访问。在Cesium中,请参见GoogleEarthImageryProvider。
- Mapbox – 使用Mapbox API访问瓦片图. 创建一个账户并提供access token. 在Cesium中, 请参见MapboxImageryProvider。
- Standard image files – 从图片中创建图层。在Cesium中, 请参见SingleTileImageryProvider。
- Custom tiling schemes – 使用UrlTemplateImageryProvider,通过使用URL模板,我们可以连接到大量图像源。 例如, TMS的url模板是 //cesiumjs.org/tilesets/imagery/naturalearthii/{z}/{x}/{reverseY}.jpg.
- Tile coordinates – 通过绘制每个瓦片图周围的边界并用其水平、X和Y坐标标记它,显示如何在特定的瓦片方案中将地球划分为多个瓦片图。
2、加载shp主要将shp格式转换为可加载的格式Geojson,或者kml
处理数据可用方法:https://mapshaper.org/或者Geoserver
#直接加载
var pro = viewer.dataSources.add(Cesium.GeoJsonDataSource.load(“json地址”,
stroke:Cesium.Color.RED,
strokeWidth:5,
fill:Cesium.Color.RED.withAlpha(0.1)
fill:new Cesium.Color(0, 0, 0, 0)//设置纯透明后,必须点击到polygon边界才显示提示框
}));
#entity方式加载
var promise =Cesium.GeoJsonDataSource.load("json地址");
promise.then(function(dataSource){
viewer.dataSources.add(dataSource);
var entities = dataSource.entities.values;
for (let i = 0; i < entities.length; i++) {
let entity = entities[i];
entity.polygon.fill=false;//设置无填充后,必须点击到polygon边界才显示提示框
entity.polygon.outline = true;
entity.polygon.outlineColor = Cesium.Color.RED;
entity.polygon.width=5//无效,polygon.width不能超过1
}});
3、加载geoson同上
topojson、Geojson、普通json三种方式
4、加载图片 一般用于具体位置的放置 SingleTileImageryProvider接口
var mypic =new Cesium.SingleTileImageryProvider({
url:"图片地址",
rectangle:Cesium.Rectangle.fromDegrees(113,31,114,33) //放置样式有很多种,比如ellipse
});
viewer.scene.imageryLayers.addImageryProvider(mypic);
//后续追加的一些设置
mypic.hasAlphaChannel=true;
mypic.defaultAlpha=0.5; //初始化的图片透明度修改,此外还可以设置对比度,亮度
5、发布的wms
使用Geoserver发布,网上有很多教程如何使用,使用接口WebMapServiceImageryProvider
var wmsLayer = new Cesium.WebMapServiceImageryProvider({
url:"http://127.0.0.1:8083/geoserver/cesium/wms",
layers:"cesium:county",//Geoserver中的cesium组county层
fill:false, //Cesium.Color.PINK.withAlpha(0.1),
parameters:{
service:"WMS",
format:"image/png",
transparent:true
}});
viewer.scene.imageryLayers.add(wmsLayer);
6、
原文地址:https://www.cnblogs.com/xiaoguniang0204/p/11675253.html