Javascript 谷歌地理定位和方向API

如何将Google Geolocation和Direction API结合起来，以便当您单击Geolocation标记和任何一个标记（我硬编码了其中的坐标）时，它将显示它们之间的方向

地理位置代码

<script type="text/javascript">
  function initialize() {
    var locations = [
     ['Hougang', 1.37265, 103.893658],
     ['Punggol', 1.400617, 103.907833],
     ['MacRitchie Reservoir', 1.346002, 103.825436],
     ['Bishan', 1.352051, 103.849125],
     ['Sentosa', 1.251226, 103.830757]
    ];
    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 15,
      center: new google.maps.LatLng(1.37265, 103.893658),
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
    var infowindow = new google.maps.InfoWindow();
    var marker, i;
    for (i = 0; i < locations.length; i++) {
      marker = new google.maps.Marker({
        position: new google.maps.LatLng(locations[i][1], locations[i][2]),
        map: map
      });
      google.maps.event.addListener(marker, 'click', (function (marker, i) {
        return function () {
          infowindow.setContent(locations[i][0]);
          infowindow.open(map, marker);
        }
      })(marker, i));
    }
    // Check if user support geo-location
    if (navigator.geolocation) {
      navigator.geolocation.getCurrentPosition(function (position) {
        var latitude = position.coords.latitude;
        var longitude = position.coords.longitude;
        var geolocpoint = new google.maps.LatLng(latitude, longitude);
        var mapOptions = {
          zoom: 8,
          center: geolocpoint,
          mapTypeId: google.maps.MapTypeId.HYBRID
        }
        // Place a marker
        var geolocation = new google.maps.Marker({
          position: geolocpoint,
          map: map,
          title: 'Your geolocation',
          icon: 'http://labs.google.com/ridefinder/images/mm_20_green.png'
        });
      });
    }
  }
  google.maps.event.addDomListener(window, 'load', initialize);
</script>

函数初始化（）{
变量位置=[
[Hougang'，1.37265，103.893658]，
[Punggol'，1.400617103.907833]，
['MacRitchie水库'，1.346002103.825436]，
[Bishan'，1.352051，103.849125]，
[“圣淘沙”，1.25122103.830757]
];
var map=new google.maps.map（document.getElementById（'map'）{
缩放：15，
中心：新google.maps.LatLng（1.37265103.893658），
mapTypeId:google.maps.mapTypeId.ROADMAP
});
var infowindow=new google.maps.infowindow（）；
var标记，i；
对于（i=0；i

• 将单击侦听器添加到标记
• 执行时，按下数组上当前标记的位置
• 如果数组的长度为2，则使用这两个位置作为起点和终点调用方向服务

类似于，但不是“映射”单击侦听器，而是使用“标记”单击侦听器

您确实说过要强制第一次单击地理位置标记，您需要编写代码来检查标记的位置，并验证它是否是地理位置标记（如果要这样做）。我认为让用户点击其中一个目的地标记，然后根据地理位置标记生成方向（您需要保留一个特殊的参考）会更简单

示例中的代码片段：

var geolocation=null；
var-ren=null；
函数初始化（）{
变量位置=[
[Hougang'，1.37265，103.893658]，
[Punggol'，1.400617103.907833]，
['MacRitchie水库'，1.346002103.825436]，
[Bishan'，1.352051，103.849125]，
[“圣淘沙”，1.25122103.830757]
];
var map=new google.maps.map（document.getElementById（'map_canvas'）{
缩放：13，
中心：新google.maps.LatLng（1.37265103.893658），
mapTypeId:google.maps.mapTypeId.ROADMAP
});
var infowindow=new google.maps.infowindow（）；
var标记，i；
//放置标记
地理位置=新的google.maps.Marker({
位置：map.getCenter（），
地图：地图，
标题：“你的地理位置”，
图标：'https://maps.google.com/mapfiles/ms/micons/green.png'
});
对于（i=0；i
html，
身体，
#地图画布{
保证金：0；
填充：0；
身高：100%；
}
值得注意的是，地理定位API