Drawing a path with a line in OpenLayers using JavaScript

Question

I have seen the examples presented here of how to draw a line but the examples only show how to do it with the mouse, by clicking.

What I want to do is draw

Answer 1

You would need to make use of the LineString object

Here is an example:

var lineLayer = new OpenLayers.Layer.Vector("Line Layer"); 

map.addLayer(lineLayer);                    
map.addControl(new OpenLayers.Control.DrawFeature(lineLayer, OpenLayers.Handler.Path));                                     
var points = new Array(
   new OpenLayers.Geometry.Point(lon1, lat1),
   new OpenLayers.Geometry.Point(lon2, lat2)
);

var line = new OpenLayers.Geometry.LineString(points);

var style = { 
  strokeColor: '#0000ff', 
  strokeOpacity: 0.5,
  strokeWidth: 5
};

var lineFeature = new OpenLayers.Feature.Vector(line, null, style);
lineLayer.addFeatures([lineFeature]);

Assuming map is your map object and lon and lat are float values.

Answer 2

I've never done it myself before, but I know OpenSteetMap does it. For example:

http://www.openstreetmap.org/?way=23649627

No idea how difficult it would be to work through their code.

Answer 3

this page is a classic example of animation via javascript using openlayers.

it uses a filter strategy to define what to show at what moment in time.

full javascript available.