目錄
一、引言
前兩篇文章介紹了以openlayers爲工具通過WFS添加和修改要素，最後我們將介紹如何刪除一個要素，修改的話比較簡單，主要是id對應就可以。
二、WFS要素刪除實現
本代碼在使用interaction中的select操作，在“select”之後獲取到feature，進行刪除。
select.on('select', function (evt) {
var feature = evt.selected[0];
//feature.set('id_',feature.attr.id);
var format = new ol.format.WFS();
var xml = format.writeTransaction(null, null, [feature], {
featureNS: 'http://geoserver.org/nyc',
featurePrefix: "xcy",//工作空間名稱
featureType: "polygon"//圖層名稱
});
var serializer = new XMLSerializer();
var featString = serializer.serializeToString(xml);
$.ajax({
url: "http://localhost:8080/geoserver/xcy/wfs",
type: "POST",
data: featString,
contentType: 'text/xml',
success: function (req) {
console.log(req);
//window.location.reload();
}
});
});
本例子中需要注意的地方，在上面代碼確實沒啥需要注意的，直接使用select就能獲取到feature，向transaction中一放就行了，注意的點應該在另外的地方：這些選中的feature是如何加載上去的。
當你使用下面加載矢量數據作爲數據源可以放心使用上面的代碼
var polygonVectorSource = new ol.source.Vector({
format: new ol.format.GeoJSON(),
url: function(extent) {
return gisip+gisport+'geoserver/xcy/wfs?service=WFS&version=1.0.0&request=GetFeature&typeName='+polygonTypename+'&outputFormat=application%2Fjson';
},
strategy: ol.loadingstrategy.bbox
});
如果你沒有使用封裝的方法，是通過獲取到geojson自己創建feature添加到source中，就需要注意了
$.ajax({
type: "GET",
url: gisip+gisport+'geoserver/xcy/wfs?service=WFS&request=GetFeature&typeName='+polygonTypename+'&outputFormat=application%2Fjson',
dataType:'json',
success: function(data){
var features=data.features;
for(var i=0;i<features.length;i++)
{
var feature=features[i];
var ft=new ol.Feature({
geometry:new ol.geom.MultiPolygon(feature.geometry.coordinates),
//attr:feature
});
ft.setId(feature.id);
ft.attr=feature;
var geometry=ft.getGeometry();
polygonVectorSource.addFeature(ft);
}
}
});
這裏必須使用ft.setId()，給feature設置id，不然你在刪除的時候id爲空，刪除不了。
三、WFS要素刪除原理
1、請求xml
<?xml version="1.0" encoding="utf-8"?>
<Transaction xmlns="http://www.opengis.net/wfs" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" service="WFS" version="1.1.0" xsi:schemaLocation="http://www.opengis.net/wfs http://schemas.opengis.net/wfs/1.1.0/wfs.xsd">
<Delete xmlns:xcy="http://geoserver.org/nyc" typeName="xcy:polygon">
<Filter xmlns="http://www.opengis.net/ogc">
<FeatureId fid="polygon.571"/>
</Filter>
</Delete>
</Transaction>
2、postman使用
3、要素刪除
4、返回xml
<?xml version="1.0" encoding="UTF-8"?>
<wfs:TransactionResponse xmlns:xs="http://www.w3.org/2001/XMLSchema" xmlns:wfs="http://www.opengis.net/wfs" xmlns:gml="http://www.opengis.net/gml" xmlns:ogc="http://www.opengis.net/ogc" xmlns:ows="http://www.opengis.net/ows" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" version="1.1.0" xsi:schemaLocation="http://www.opengis.net/wfs http://localhost:8080/geoserver/schemas/wfs/1.1.0/wfs.xsd">
<wfs:TransactionSummary>
<wfs:totalInserted>0</wfs:totalInserted>
<wfs:totalUpdated>0</wfs:totalUpdated>
<wfs:totalDeleted>1</wfs:totalDeleted>
</wfs:TransactionSummary>
<wfs:TransactionResults/>
<wfs:InsertResults>
<wfs:Feature>
<ogc:FeatureId fid="none"/>
</wfs:Feature>
</wfs:InsertResults>
</wfs:TransactionResponse>
四、openlayers中feature的座標信息獲取
獲取到feature對象的geometry對象
座標信息都在flatcoordinate中，我們自然想從其中獲取，直接使用js基礎知識.出來，不過獲取到的multipolygon竟然是一個數組，what？不過人明明寫着呢是flatcoordinate，就是這樣的
要獲取到比較規範的要使用下面的，這樣使用起來比較方便
五、總結
- WFS要素刪除實現；
- WFS要素刪除原理；
- feature對象座標信息獲取；