javascript - 使用 JavaScript 在 OpenLayers 中绘制一条带线的路径

Question

我已经看过这里介绍的如何画线的例子，但这些例子只显示了如何用鼠标点击。

我想要做的是使用 JavaScript 手动绘制线条，给出经度和纬度坐标列表。

我无法使用上面链接中提供的源的原因是因为他们只调用activate该功能，然后让用户指向并单击地图。

有没有人以编程方式在 OpenLayers 地图上绘制路径？

我想要做的正是这个： http: //openspace.ordnancesurvey.co.uk/openspace/example4.html，但不使用 OpenSpace。

Answer 1

您需要使用LineString对象

这是一个例子：

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]);

假设map是您的地图对象，lon并且lat是浮点值。

Answer 2

此页面是使用 openlayers 通过 javascript 制作动画的经典示例。

它使用过滤策略来定义在什么时间显示什么。

完整的 javascript 可用。

Answer 3

我以前从未自己做过，但我知道 OpenSteetMap 做到了。例如：

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

不知道通过他们的代码工作会有多困难。