使用JavaScript在OpenLayers中使用一條線繪製路徑

我已經看到了如何繪製線的示例here，但示例僅顯示如何使用鼠標單擊來繪製線條。使用JavaScript在OpenLayers中使用一條線繪製路徑

我想要做的是給出一個經度和緯度座標列表使用JavaScript手動繪製線條。

我無法在上面的鏈接中提供的源代碼的原因是，他們只在該功能上調用activate，然後讓用戶指向並單擊地圖。

有沒有人以編程方式在OpenLayers地圖上繪製路徑？

我想要做的就是這個：http://openspace.ordnancesurvey.co.uk/openspace/example4.html，但沒有使用OpenSpace。

來源

2010-04-29 Andreas Grech

您將需要利用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是浮點值。

來源

2010-04-29 19:44:19 Drahcir

我不得不使用'new OpenLayers.Geometry.Point（lon，lat）.transform（new OpenLayers.Projection（「EPSG：4326」），map.getProjectionObject（））;'而不是僅僅使用'new OpenLayers.Geometry.Point （lon1，lat1）'因爲我有wsg84座標 – yankee 2012-06-16 21:07:10

工作示例（通過Mannaz +小修改）http://jsfiddle.net/4q7vx/25/ – aatdark 2013-07-27 01:41:57

良好的示例。 DrawFeature實際上不需要，「map.addControl（.... DrawFeature ...）」行;「可以省略。 – dube 2013-08-15 12:53:15

我從來沒有做過自己之前，但我知道OpenSteetMap做到了。例如：

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

不知道這將是多麼困難，通過他們的代碼工作。

來源

2010-04-29 09:01:43 RoToRa

是的，我確實看到了OpenStreetMap的例子，但我試圖只用OpenLayers做到這一點 – 2010-04-29 09:04:37

好的。抱歉，不能幫助你。 – RoToRa 2010-04-29 09:10:24

this page is a classic example動畫通過JavaScript使用openlayers。

它使用過濾器策略來定義什麼時候顯示什麼。

完整的JavaScript可用。

來源

2013-02-15 14:33:28

經典！ :) 404 – 2015-04-20 12:50:55

@HenryAloni感謝您的提升。更改了URL以反映openlayers.org新的Web結構（從子目錄到子域）中的更改。 ;） – 2015-04-30 17:14:02

使用JavaScript在OpenLayers中使用一條線繪製路徑

回答

相關問題