Question

我正在使用活动跟踪器跟踪学生的学习步骤。他们每天需要走5英里。我想做的是显示一个Google地图，显示他们在16个学期内从德克萨斯州赛普拉斯到路易斯安那州新奥尔良的步行路程。第一周后，他们将走25英里，所以我想使用一个航路点显示他们在那条路线上到达的位置。然后在下周，再显示他们每周行走的另外25或20或12英里或任何数量的里程，依此类推。我将在我的MySQL数据库中存储一组经纬度数据，用于显示每个航路点。

这是我到目前为止的内容： JSFiddle

这是我从Google API示例中获得的代码：

    function initMap() {
  var directionsService = new google.maps.DirectionsService;
  var directionsDisplay = new google.maps.DirectionsRenderer;
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 6,
              center: {lat: 29.907761, lng: -95.707844}

  });
  directionsDisplay.setMap(map);

  document.getElementById('submit').addEventListener('click', function() {
    calculateAndDisplayRoute(directionsService, directionsDisplay);
  });
}

function calculateAndDisplayRoute(directionsService, directionsDisplay) {
  var waypts = [];
  var checkboxArray = document.getElementById('waypoints');
  for (var i = 0; i < checkboxArray.length; i++) {
    if (checkboxArray.options[i].selected) {
      waypts.push({
        location: checkboxArray[i].value,
        stopover: true
      });
    }
  }

  directionsService.route({
    origin: document.getElementById('start').value,
    destination: document.getElementById('end').value,
    waypoints: waypts,
    optimizeWaypoints: true,
    travelMode: 'WALKING'
  }, function(response, status) {
    if (status === 'OK') {
      directionsDisplay.setDirections(response);
      var route = response.routes[0];
      var summaryPanel = document.getElementById('directions-panel');
      summaryPanel.innerHTML = '';
      // For each route, display summary information.
      for (var i = 0; i < route.legs.length; i++) {
        var routeSegment = i + 1;
        summaryPanel.innerHTML += '<b>Route Segment: ' + routeSegment +
            '</b><br>';
        summaryPanel.innerHTML += route.legs[i].start_address + ' to ';
        summaryPanel.innerHTML += route.legs[i].end_address + '<br>';
        summaryPanel.innerHTML += route.legs[i].distance.text + '<br><br>';
      }
    } else {
      window.alert('Directions request failed due to ' + status);
    }
  });
}

那么，如何添加到每个路标的行驶里程？

我希望我的问题很清楚，否则请问。

谢谢

蒂姆

Google Maps V3-如何将X英里数添加到上一个航路点？

0 个答案: