javascript - 如何使 WFS 图层在传单地图上可编辑并且编辑将反映在地理服务器上？

Question

从地理服务器调用 WFS 图层并添加到传单地图的代码。我想让它可编辑，并且更改将反映在 geoserver 上的 WFS 层上。我花了 4 个多小时试图弄清楚如何做到这一点。我使用 Leaflet 和 Leaflet Draw 在我的地图上绘制新闻功能。

现在我希望能够编辑现有 WFS 图层的功能（来自地理服务器）。

我在互联网上进行了很多搜索，但找不到一个清晰的示例来说明如何使我的 WFS 图层可编辑。

    var map = L.map('map', {editable: true}).setView([51.505, -0.09], 13);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
    attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
map.addControl(drawControl);
var owsrootUrl = 'http://localhost:8088/geoserver/topp/ows';      
 var defaultParameters = {  
      service : 'WFS',  
      version : '1.0.0',  
      request : 'GetFeature',  
      typeName : 'topp:states',  
      maxFeatures: '50',  
      outputFormat : 'application/json', 
      editable : 'true',
      //cql_filter : "INTERSECTS(the_geom, querySingle('restricted', 'the_geom','cat = 3'))"     
      cql_filter : "PERSONS > 15000000 AND STATE_NAME = 'Texas'"
 };  
 //parameters are defined 
 var parameters = L.Util.extend(defaultParameters);  
  var URL = owsrootUrl + L.Util.getParamString(parameters);  
  var x 
  var response2 = [];
  var WFSLayer=null; 
  var selectedFeature = null;
  var ajax = $.ajax({  
      url : URL,  
      async: false, 
      jsonp: false, 
      jsonpCallback: 'getJson', 
      datatype: 'json',   
      success : function (response) {  
          response2.push(response);
          console.log("response", response)
      WFSLayer = L.geoJson(response, { 
              style: function (feature) {  
                  return {  
                      weight: 4, 
                      color: "red", 
                      opacity: 1, 
                      fillColor: "red", 
                      fillOpacity: 0.5  
                  };  
              }, 
 }).addTo(map)              
     }   
 }); 

//我想让它可编辑。

标签： javascriptleafletgeoserverleaflet-draw