Cesium调用Geoserver发布的 WMS、WFS服务
1 GeoServer服務發(fā)布
1.1 WMS服務
下載GeoServer安裝版安裝，同時安裝geopackage擴展，以備使用。使用XX地圖下載器下載地圖，導出成GeoPackage地圖文件。
（1）下載 GeoPackage DEM數(shù)據(jù)
（2）打開GeoServer服務界面
（3）點擊左側(cè)工作區(qū) ->添加新的工作區(qū) ->輸入一個名字URL可以隨意起，點擊提交（作者使用的名字是Cesium）
（4）點擊左側(cè)數(shù)據(jù)存儲->新建數(shù)據(jù)源，會發(fā)現(xiàn)兩個GeoPackage，此處根據(jù)下載的地圖類型選擇即可
（5）工作區(qū)選擇剛剛新建的工作區(qū)，數(shù)據(jù)源名稱可以隨便起，連接參數(shù)點擊瀏覽選擇剛才導出的GeoPackage文件
?
發(fā)布成功后彈出如下窗口，點擊發(fā)布?
點擊左側(cè) -> Layer Perview 找的剛才發(fā)布的圖層，點擊 OpenLayers? 出現(xiàn)如下效果：
?
?
2 Cesium調(diào)用
2.1 WMS服務
打開Cesium工作區(qū)，添加如下代碼。
<script> var viewer = new Cesium.Viewer('cesiumContainer'); var provider = new Cesium.WebMapServiceImageryProvider({ url: 'http://localhost:8082/geoserver/cesium/wms', layers: 'cesium:taile', parameters: { <span style="white-space:pre"> </span> service : 'WMS', format: 'image/png', transparent: true, } }); viewer.imageryLayers.addImageryProvider(provider); </script>至此Cesium離線地圖服務完成
注意：最后訪問時使用谷歌瀏覽器跨域方式訪問，否則會出現(xiàn)WMS服務無響應的情況。
?
2.2 WFS服務
需求: 為了便于前端渲染數(shù)據(jù),自定義圖層渲染。
思路：獲取地圖服務中的要素進行渲染。
工具：GeoServer2.6.4,cesium,
?
思路有了就開始找資料寫代碼,cesium有接口可以加載WMS服務，但是加載的WMS服務獲取到的是切片,不可能將獲取到的要素進行渲染。于是想通過WFS服務來渲染數(shù)據(jù)，但是cesium沒有提供可用的接口，通過google,找到了一個比較靠譜的思路：geoserver的地圖服務支持很多格式，其中就可以顯示GeoJson數(shù)據(jù)，然后通過AJAX獲取geoserver服務中的GeoJson數(shù)據(jù)，在通過cesium的GeoJsonDataSource進行數(shù)據(jù)的加載，然后渲染就好說了。
這里假設geoserver的WFS服務已經(jīng)發(fā)布好了。
?
獲取服務地址
在GeoServer的LayerPreview圖層列表中的目標圖層后面，再select on中選擇GeoJson。
這個時候頁面中會以GeoJson格式顯示該圖層的數(shù)據(jù)，然后地址欄中的鏈接就是我們需要的地址，如下圖所示。
?
?
?
AJAX獲取GeoJson數(shù)據(jù)
?
var viewer = newCesium.Viewer('cesiumContainer');$.ajax({url:"http://localhost:8082/geoserver/mytest/ows?service=WFS&request=GetFeature&typeName=mytest:river4&outputFormat=application/json",cache: false,async: true,success: function(data) {var datasource=Cesium.GeoJsonDataSource.load(data);viewer.dataSources.add(datasource);},error: function(data) {console.log("error");}});?
這樣數(shù)據(jù)就被加載到cesium中了，然后使用 dataSource.entities.values，就可以對圖層進行渲染了,代碼如下:
var entities = dataSource.entities.values;for (var i = 0; i < entities.length; i++) {var entity = entities[i];var polylineVolume = {positions:entity.polyline._positions,shape:computeCircle(50.0),material:Cesium.Color.RED}entity.polylineVolume=polylineVolume;entity.polyline=null; }?
PS:這里還要解決跨域問題，否則ajax獲取不到GeoJson數(shù)據(jù)，解決方法：http://pan.baidu.com/s/1cpGg1o 或 Cesium_Load_GeoJson.rar
效果圖：
?
?
?
?
?
?
參考文章
kill5921， ? Cesium 調(diào)用Geoserver WMS服務及Geoserver服務發(fā)布
cesium加載WFS服務(GeoServer發(fā)布)
?
?
?
轉(zhuǎn)載于:https://www.cnblogs.com/arxive/p/8414843.html
總結(jié)
以上是生活随笔為你收集整理的Cesium调用Geoserver发布的 WMS、WFS服务的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Manacher's Algorithm
- 下一篇： bzoj4709 [Jsoi2011]柠