//绘制geojson图层样式
var geoJsonStyle ={
stroke: Cesium.Color.YELLOW,
strokeWidth:3,
fill: Cesium.Color.YELLOW.withAlpha(0.1)
};var geoserverUrl = 'http://localhost:8080/geoserver/WebGIS';var image_Source = newCesium.UrlTemplateImageryProvider({//url: 'http://mt0.google.cn/vt/lyrs=t,r&hl=zh-CN&gl=cn&x={x}&y={y}&z={z}',//url: 'https://server.arcgisonline.com/arcgis/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}',
url: "http://map.geoq.cn/ArcGIS/rest/services/ChinaOnlineStreetPurplishBlue/MapServer/tile/{z}/{y}/{x}",//tilingScheme : new Cesium.GeographicTilingScheme(),
credit: ''});var viewer = new Cesium.Viewer('map', {
geocoder:false,
homeButton:false,
sceneModePicker:false,
fullscreenButton:false,
vrButton:false,
baseLayerPicker:false,
infoBox:false,
selectionIndicator:false,
animation:false,
timeline:false,
shouldAnimate:true,
navigationHelpButton:false,
navigationInstructionsInitiallyVisible:false,
imageryProvider: image_Source
});//加载geoserver wms服务
var wms = newCesium.WebMapServiceImageryProvider({
url: geoserverUrl+'/wms',
layers:'WebGIS:testLayer',
parameters: {
service :'WMS',
format:'image/png',
transparent:true,
}
});
viewer.imageryLayers.addImageryProvider(wms);
viewer._cesiumWidget._creditContainer.style.display= "none";
viewer.scene.globe.enableLighting= false;//viewer.scene.globe.depthTestAgainstTerrain = true;
viewer.scene.globe.showGroundAtmosphere = false;
viewer.camera.flyTo({
destination : Cesium.Cartesian3.fromDegrees(113.90271877, 22.95186415,30000.0)
});var handler = newCesium.ScreenSpaceEventHandler(viewer.scene.canvas);var ellipsoid =viewer.scene.globe.ellipsoid;
handler.setInputAction(function(movement) {//通过指定的椭球或者地图对应的坐标系,将鼠标的二维坐标转换为对应椭球体三维坐标
cartesian =viewer.camera.pickEllipsoid(movement.position, ellipsoid);if(cartesian) {//将笛卡尔坐标转换为地理坐标
var cartographic =ellipsoid.cartesianToCartographic(cartesian);//将弧度转为度的十进制度表示
var longitudeString =Cesium.Math.toDegrees(cartographic.longitude);var latitudeString =Cesium.Math.toDegrees(cartographic.latitude);var point = longitudeString + ',' +latitudeString;
queryByPoint(point,'testLayer',callbackLastQueryWFSService);
}
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);/*点查图层
*@method queryByPoint
*@param point 点查
*@param typeName 图层名称
*@return null*/
functionqueryByPoint(point, typeName, callback){var filter =
'';
filter+= '';
filter+= 'the_geom';
filter+= '';
filter+= '' + point + '';
filter+= '';
filter+= '';
filter+= '';var urlString = geoserverUrl + '/ows';var param ={
service:'WFS',
version:'1.0.0',
request:'GetFeature',
typeName: typeName,
outputFormat:'application/json',
filter: filter
};var geojsonUrl = urlString +getParamString(param, urlString);
$.ajax({
url: geojsonUrl,
async:true,
type:'GET',
dataType:'json',
success(result) {
callback(result);
},
error(err) {
console.log(err);
}
})
}functiongetParamString(obj, existingUrl, uppercase){var params =[];for (var i inobj) {
params.push(encodeURIComponent(uppercase? i.toUpperCase() : i) + '=' +encodeURIComponent(obj[i]));
}return ((!existingUrl || existingUrl.indexOf('?') === -1) ? '?' : '&') + params.join('&');
}/** 点查图层回调函数*/
functioncallbackLastQueryWFSService(data){
console.log('data',data);if(data && data.features.length>0){
clearGeojsonLayer();
loadGeojsonLayer(data);//气泡窗口显示
var properties = data.features[0].properties;var id = data.features[0].id;var geometry = data.features[0].geometry;//var content = '名称:'+properties.estate_num+'备注:'+properties.holder_nam;
var content = '名称:备注:编辑';
$("#infowindow").show();
$("#infowindow").empty();
$("#infowindow").append(content);
$("#editBtn").click(function(){//console.log('编辑按钮点击事件');
if(id)
{//构造polygon
var polygon = '';var data = geometry.coordinates[0][0];for(var i=0;i
polygon+= item[0] + ',' + item[1] + ' ';
}
polygon+= data[0][0] + ',' + data[0][1];//只编辑属性信息,默认图形信息不变,感兴趣的,读者你们可自行编辑图形变化信息,这里预留图形参数传值了的
editLayers(id,polygon,$("#estate_num").val(),$("#holder_nam").val(),callbackEditLayersWFSService);
}
});
}else{//clearMap();
$("#infowindow").hide();
}
}/** 绘制图形函数*/
functionloadGeojsonLayer(geojson){var promise =Cesium.GeoJsonDataSource.load(geojson,geoJsonStyle);
promise.then(function(dataSource) {
viewer.dataSources.add(dataSource);//viewer.zoomTo(dataSource);
}).otherwise(function(error){
window.alert(error);
});
}/** 清空绘制图形函数*/
functionclearGeojsonLayer(){
viewer.dataSources.removeAll();
}functionclearMap(){if(drawTool) {
drawTool.destroy();
}
clearGeojsonLayer();
}/*图层编辑
*@method editLayers
*@param polygon 图形
*@param fid 记录fid值
*@param fieldValue1 字段1值
*@param fieldValue2 字段2值
*@return callback*/
functioneditLayers(fid,polygon,fieldValue1,fieldValue2, callback){var xml = '';
xml+= '';
xml+= '';
xml+= 'the_geom';……
……}