Edit features

The module provides the components to edit, delete and add new features (their attributes and geometry) through WFS-T.

API

Full documentation and API is available on GitHub at src/edit-features/edit-features.js.

Dependencies

This library depends on several leading javascript libraries. There is a list below.

• jQuery,
• OpenLayers,
• Bootstrap,
• X-editable.

Example

Several crucial points must be configured. The module requires link to WFS-T, where modified data is sent. Also GUI must be configured in order to be able to use feature functionalities. Finally, the edited layer must be added to editFeature module.

If you want to use this module you need to provide link to your WFS-T, and configure GUI in order to use feature functionalities. Then you must manage the layer you want to edit by adding it to editFeature module.

// Selectors for editing popup overlay
var container = $('#popup');
var content = $('#popup-content');
var closer = $('#popup-closer');

// Format of the GML
var formatGML = new ol.format.GML({
    featureNS: 'featureNS',
    featureType: 'featureType',
    srsName: 'EPSG:4326'
});

// Standard WFS layer with it's source
var layerWFS = new ol.layer.Vector({
    source: sourceWFS
});

// OpanLayers 3 Map object
var map = new ol.Map({
    target: 'map',
    controls: [],
    interactions: [
        new ol.interaction.MouseWheelZoom(),
        new ol.interaction.DragPan()
    ],
    layers: [
        layerOSM,
        layerWFS
    ],
    view: new ol.View({
        projection: 'EPSG:4326',
        zoom: 14
    })
});

// Initialisation of the editFeatures, providing Selectors for popup and GUI buttons, ol.Map Object and url to WFS-T
gsc.editFeatures.create(container, content, closer, '#mdl-button', map, url);
// Adding new layer (and its GML format) in order to edit it.
// Adding new layer will result in removing the old one.
gsc.editFeatures.addLayer(layerWFS, formatGML);

Complete example can be found here.