1

I am trying to find a working example of editing the attributes of a feature in a PostGIS table published in GeoServer (2.8), using Javascript libraries like openlayers (3 & 4).

The closest thing I can find is the Modify Feature example from the openlayers documentation, but it only touches geometry not attributes. In addition it is based on GeoJSON, not a database backend.

The next closest is an OpenGeo blog, but it's just a blog with a screenshot without and code snippet. Also relevant is a similar GIS.SE question: Map editor R & leaflet?. The answer there suggests that one has to program it from javascript.

Before reinventing some wheels, can anyone give me some pointers how to implement such a function for setting the attribute of a feature?

FYI, I have copied the said openlayers 4 example below as a starting point.

<!DOCTYPE html>
<html>
  <head>
    <title>Modify Features</title>
    <link rel="stylesheet" href="https://openlayers.org/en/v4.0.1/css/ol.css" type="text/css">
    <!-- The line below is only needed for old environments like Internet Explorer and Android 4.x -->
    <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL"></script>
    <script src="https://openlayers.org/en/v4.0.1/build/ol.js"></script>
  </head>
  <body>
    <div id="map" class="map"></div>
    <script>
      var raster = new ol.layer.Tile({
        source: new ol.source.OSM()
      });

      var vector = new ol.layer.Vector({
        source: new ol.source.Vector({
          url: 'https://openlayers.org/en/v4.0.1/examples/data/geojson/countries.geojson',
          format: new ol.format.GeoJSON(),
          wrapX: false
        })
      });

      var select = new ol.interaction.Select({
        wrapX: false
      });

      var modify = new ol.interaction.Modify({
        features: select.getFeatures()
      });

      var map = new ol.Map({
        interactions: ol.interaction.defaults().extend([select, modify]),
        layers: [raster, vector],
        target: 'map',
        view: new ol.View({
          center: [0, 0],
          zoom: 2
        })
      });
    </script>
  </body>
</html>

-- EDIT --

This is not a duplicate of the said question How can I use WFS-T in openlayers?, as that question is about OpenLayers 2. As said in the beginning, my question is about OpenLayers 3&4, which is not backwards compatible with Openlayers 2, and missing a large number of features in OpenLayers2. So the said question/answers don't apply here. I've also used the openlayers tag per tag description to differentiate this from openlayers2 questions.

  • I've edited the question to indicate why openlayer2 questions in the said duplicate do not apply in openlayers3+. They are not backwards compatible. Please consider reopen. – tinlyx Mar 17 '17 at 16:26
  • So you have tested that answer and it doesn't work? – Midavalo Mar 17 '17 at 17:03
  • @Midavalo There is no OpenLayers.Strategy.Save() in OpenLayers 3 in that one-liner answer to begin with. How should one test it? – tinlyx Mar 17 '17 at 19:01

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.