Dynamically adding and removing segments from a tr

Question

I want to display a track in real-time with OpenLayers 3 which disolves at the end, just like a snails trail.

Only appending new coordinates to a LineString is easy. See this example. But removing coordinates from the end of the line does not seem to be supported by the API.

How should I go about that? Is extending the LineString class the only option? Or should I use a separate feature for each line segment?

Update:

I used this code with ol-debug.js. But get/setFlatCoordinates is not exported in the compiled version.

var flatCoordinates = geometry.getFlatCoordinates();  // not exported
if (flatCoordinates && flatCoordinates.length > 100) {
  // remove first coordinate elements from array
  flatCoordinates.splice(0, geometry.getStride());
  // call push with coordinate elements as arguments
  Array.prototype.push.apply(flatCoordinates, coordinate);
  // update coordinates calling change()
  geometry.setFlatCoordinates(geometry.getLayout(), flatCoordinates);
} 
else {
  geometry.appendCoordinate(coordinate);
}

Answer 1

The appendCoordinate method is a shortcut for the fairly common use case of adding a coordinate to the end of a LineString. To modify geometries with more control, set your desired coordinates with setCoordinates.

var maxCoords = 100;
var coords = lineString.getCoordinates(); // get coordinate array
coords.unshift(newCoord); // add to beginning of array
if (coords.length > maxCoords) {
    coords.length = maxCoords;
}
lineString.setCoordinates(coords);