地図上に座標を表示し、それらの間に矢印を描く方法は？

Question

Iは、次のように実際の位置の座標のリストを持っている：

index X    y 
1 24050.0000 123783.3333 
2 24216.6667 123933.3333 
3 24233.3333 123950.0000 
4 24233.3333 124016.6667 
     ................. 

は、これらは、（むしろ分と秒未満）小数点形式で与えられ、緯度と経度です。 the source

地図上に地図を表示する地図を地図上にデザインしたいのですが、地図上にこれらの場所がインデックスで表示されます。 また、その間に矢印を描きたい（1 - > 2）、（2 - > 3）、...、そうです。

どうすればいいですか？

あまりにも多くの作業が必要ですか、それとも簡単な方法がありますか？

あなたがそれを行う方法を知っていれば、最も簡単な方法を指摘してください。

私はJavascriptを使用しています。 ありがとうございます！

Answer 1

ポリラインを作成し、矢印アイコンを割り当てることで、これを行うことができます。

// Here you create the map 

function initMap() { 
    var map = new google.maps.Map(document.getElementById('map'), { 
    zoom: 3, 
    center: {lat: 0, lng: -180}, 
    mapTypeId: google.maps.MapTypeId.TERRAIN 
    }); 

//Here are the coordinates of the points you are going to match 

    var flightPlanCoordinates = [ 
    {lat: 37.772, lng: -122.214}, 
    {lat: 21.291, lng: -157.821}, 
    {lat: -18.142, lng: 178.431}, 
    {lat: -27.467, lng: 153.027} 
    ]; 

//Here you create the polyline and assign the arrow icon to it 

    var flightPath = new google.maps.Polyline({ 
    path: flightPlanCoordinates, 
    icons: [{ 
     icon: lineSymbol, 
     offset: '100%' 
    }], 
    geodesic: true, 
    strokeColor: '#FF0000', 
    strokeOpacity: 1.0, 
    strokeWeight: 2 
    }); 

     flightPath.setMap(map); 
    } 

情報は、私はこれが