I’ve written this article to help people who wants to make some modifications on a vector layer easily. You can find lots of tutorial on the web to draw on a layer. This article is focused on how to make modification and how to report these on the web server.
First, I deployed a Geoserver 2.7 in a Tomcat. By default, Geoserver can communicate by WFS. Tomcat is set on port 8888 on my localhost, that is why I use this port in my code.
All this code are compatible with the version of OpenLayers 3 (v3.8.2) !
OpenLayers And The OSGeo
OpenLayers is an OSGeo project: http://www.osgeo.org/openlayers
But what is OSGeo?
« The Open Source Geospatial Foundation (OSGeo), is a non-profit non-governmental organization whose mission is to support and promote the collaborative development of open geospatial technologies and data. The foundation was formed in February 2006 to provide financial, organizational and legal support to the broader Free and open source geospatial community. It also serves as an independent legal entity to which community members can contribute code, funding and other resources, secure in the knowledge that their contributions will be maintained for public benefit.
OSGeo draws governance inspiration from several aspects of the Apache Foundation, including a membership composed of individuals drawn from foundation projects who are selected for membership status based on their active contribution to foundation projects and governance.
The foundation pursues goals beyond software development, such as promoting more open access to government produced geospatial data and completely free geodata, such as that created and maintained by the OpenStreetMap project. Education and training are also addressed. Various committees within the foundation work on implementing strategies.“
Declaring a map and adding a base layer
Adding a map element and two buttons (one to delete and the other to save this layer by WFS-T protocol).
Setting the map element.
Adding a base layer map. It is more easy to work.
Adding the vector layer by WFS on the map
Adding default control : select, modify
Now, we want to select some points, and modify their positions.
Custom delete function
In Openlayers 3, we do not have yet a delete control. So here is my custom code :
Custom transactional function
And here is the most important part to make transaction, by WFS protocol, possible.
And the job is done ! I hope this little tutorial will help you to use the WFS-T protocol in OpenLayers 3.