使用JavaScript在OpenLayers中绘制一条路径线。

Question

我看过这里展示的绘制线条的示例（点击此处查看），但这些示例只展示如何通过鼠标点击来完成绘制。

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

我不能使用上面链接中提供的源代码，因为它们只是在要素上调用了activate，然后让用户在地图上点击。

是否有人曾经以编程方式在 OpenLayers 地图上绘制路径？

我的目标与这个类似：http://openspace.ordnancesurvey.co.uk/openspace/example4.html，但不使用 OpenSpace。

- Andreas Grech

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 是浮点数值。

- Drahcir

---

因为我的坐标使用了 WSG84 格式，所以我需要使用 new OpenLayers.Geometry.Point(lon, lat).transform(new OpenLayers.Projection("EPSG:4326"), map.getProjectionObject()); 而不是仅使用 new OpenLayers.Geometry.Point(lon1, lat1)。 - yankee

好的示例。实际上不需要DrawFeature，可以省略掉“map.addControl(....DrawFeature...);”这一行。 - dube