Question

我有一个实际位置坐标列表如下：

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 - ＆gt; 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);
    }

信息取自https://developers.google.com/maps/documentation/javascript/examples/polyline-simple和https://developers.google.com/maps/documentation/javascript/examples/overlay-symbol-arrow

我希望这可以帮助你

如何在地图上显示坐标并在它们之间绘制箭头？

1 个答案: