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

And*_*ech 31 javascript map openlayers

我已经看到了这里提供的如何绘制线条的示例,但示例仅显示了如何使用鼠标进行操作,方法是单击.

我想要做的是在给定经度和纬度坐标列表的情况下使用JavaScript手动绘制线条.

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

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

我想要做的就是:http://openspace.ordnancesurvey.co.uk/openspace/example4.html,但不使用OpenSpace.

Dra*_*cir 53

您需要使用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]);
Run Code Online (Sandbox Code Playgroud)

假设map是你的地图对象,lonlat为浮点值.

  • 我不得不使用`new OpenLayers.Geometry.Point(lon,lat).transform(new OpenLayers.Projection("EPSG:4326"),map.getProjectionObject());`而不仅仅是`new OpenLayers.Geometry.Point( lon1,lat1)`因为我有wsg84坐标 (4认同)
  • 工作实例(通过Mannaz +小修改)http://jsfiddle.net/4q7vx/25/ (2认同)