web-dev-qa-db-ja.com

JavaScriptを使用してOpenLayersで線でパスを描画する

私は提示された例を見てきました ここ 線を描く方法の例ですが、例はクリックしてマウスでそれを行う方法を示しています。

私がやりたいのは、経度と緯度の座標のリストを指定してJavaScriptを使用して手動で線を引くことです。

上記のリンクで提供されているソースで作業できないのは、機能でactivateを呼び出しているだけなので、ユーザーにマップをポイントしてクリックさせるためです。

OpenLayersマップにプログラムでパスを描いた人はいますか？

私がやりたいのはこれだけです： http://openspace.ordnancesurvey.co.uk/openspace/example4.html ですが、OpenSpaceを使用しません。

javascriptmapopenlayers
31
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が浮動小数点値であると仮定します。

53
Drahcir

このページは古典的な例です openlayersを使用したJavaScriptによるアニメーション。

フィルター戦略を使用して、いつ何を表示するかを定義します。

利用可能な完全なJavaScript。

1
tony gil

私自身、これまで自分でやったことはありませんが、OpenSteetMapがそれを行うことは知っています。例えば：

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

コードを処理するのがどれほど難しいかはわかりません。

0
RoToRa