Drawing marker top of a line - openlayers-3

Question

I am trying to draw a line on top of another line using open layer. The idea is draw a second line top of the predefined line path.
How can we draw a line with starting coordinate and distance on top of the predefined line path?

Answer 1

You can do this by returning a 2nd style from your layer's style function, which has a custom geometry derived from the original one:
var lineStyle = new ol.style.Style(...); // your existing style
var secondLineStyle = new ol.style.Style({
... // styles for the 2nd line
geometry: function(feature) {
var geometry = feature.getGeometry().clone();
... // modify the geometry, e.g. using forEachSegment and getCoordinateAtM
return geometry;
}
});
var layer = new ol.layer.Vector({
style: function(feature, resolution) {
return [
lineStyle,
secondLineStyle
];
}
});