ol-geometry-editor Getting started

Example with custom drawing style


html

<!-- map input -->
<input type="text" id="the_geom" class="geometry form-control" name="the_geom"
value='{"type":"Point","coordinates":[2.4249798,48.8445111]}'/>

javascript

var circleRadius = 15
var fillColor = 'rgba(255, 255, 255, 0.5)';
var strokeColor = 'blue'
var strokeWidth = 2

var fill = new ol.style.Fill({
    color: fillColor
});
var stroke = new ol.style.Stroke({
    color: strokeColor,
    width: strokeWidth
});
var image = new ol.style.Circle({
    fill: fill,
    stroke: stroke,
    radius: circleRadius
});

var style = [new ol.style.Style({
    image: image
})];

$(document).ready(function () {

    $('.geometry').geometryEditor({
        'geometryType': "Point",
        'style': style
    });

});