I have a style function for LineStrings which will place a circle at each vertex of a feature.
When I select the feature it reverts to using the default style even though I have replicated my style function with a minor (colour) change. The other minor bug is that the function has two params (start, end) but I would like to place the circle on every vertex. Is there a way to achieve this?
Specifically though, is there a reason why it might be unable to display a selected feature using a style function? I am replicating the code below:
var selectedStyle = function (feature, resolution) {
var geometry = feature.getGeometry();
var styles = [
// linestring
new ol.style.Style({
stroke: new ol.style.Stroke({
color: '#ffcc33',
width: 6
})
})
];
geometry.forEachSegment(function (start, end) {
var dx = end[0] - start[0];
var dy = end[1] - start[1];
var rotation = Math.atan2(dy, dx);
// circles
styles.push(new ol.style.Style({
geometry: new ol.geom.Point(end),
image: new ol.style.Circle({
radius: 5,
fill: new ol.style.Fill({
color: 'rgb(0, 0, 255)'
}),
stroke: new ol.style.Stroke({ color: 'blue', width: 2 })
})
}));
});
return styles;
};
Best Answer
I ll give an example I use for a layer use to draw polygons and lines. So you may get the idea and adjust to fit your needs. The geometry function is collecting all the vertices exist on the feature passed, and then it returns a multipoint out of these coords.