Question

我正在创建这个应用程序，我让用户使用谷歌地图指示服务绘制一个航路点路线，目前我正在编辑路线页面 - 这是用户可以拖动路线的航点以重新排序它们。我无法获得当前拖动的航路点的纬度和纬度。

如何在拖拽结束时访问拖动的航点对象的纬度/经度？

这是我的代码：

<script type="text/javascript">
var rendererOptions = {
  draggable: true
};
var phpway = <?php echo json_encode($phpway); ?>;
var directionsDisplay = new google.maps.DirectionsRenderer(rendererOptions);;
var directionsService = new google.maps.DirectionsService();
var map;

var waypts = [];

for(var i = 0; i < phpway.length; i+=2){
  waypts.push(new google.maps.LatLng(Number(phpway[i]), Number(phpway[i+1]))); 
}

var start = waypts[0];
var end = waypts[waypts.length-1];
var mywaypts = [];
var pointsArray = [];

  for (var i = 1; i < waypts.length-1; i++) {

          mywaypts.push({
          location:waypts[i],
          stopover:true});
  }

var australia = new google.maps.LatLng(-25.274398, 133.775136);

function initialize() {

  var mapOptions = {
    zoom: 7,
    center: australia
  };
  map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
  directionsDisplay.setMap(map);
  directionsDisplay.setPanel(document.getElementById('directionsPanel'));

  google.maps.event.addListener(directionsDisplay, 'directions_changed', function() {
    //computeTotalDistance(directionsDisplay.getDirections());
    calcRoute();

  });

  calcRoute();
}

function calcRoute() {

  console.log(start);

  var request = {
    origin: start,
    destination: end,
    waypoints: mywaypts,
    optimizeWaypoints: true,
    travelMode: google.maps.TravelMode.DRIVING
  };
  directionsService.route(request, function(response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      directionsDisplay.setDirections(response);
    }
  });
}

google.maps.event.addDomListener(window, 'load', initialize);
</script>

Answer 1

在＆＃39; directions_changed＆＃39;事件处理程序，通过＆＃34; new＆＃34;返回的方向： directionsDisplay.getDirections()。每条腿的起点/终点位置是航路点（注意第一条腿的末端与第二条腿的起点相同）。

google.maps.event.addListener(directionsDisplay, 'directions_changed', function () {
    document.getElementById('waypoints').innerHTML = "";
    var response = directionsDisplay.getDirections();
    var route = response.routes[0];
    var path = response.routes[0].overview_path;
    var legs = response.routes[0].legs;
    for (i=0;i<legs.length;i++) {
      document.getElementById('waypoints').innerHTML +=  legs[i].start_location.toUrlValue(6) +":";
      document.getElementById('waypoints').innerHTML +=  legs[i].end_location.toUrlValue(6)+"<br>";
    }
});

fiddle

Answer 2

检查var dirs = directionsDisplay.getDirections();，也许使用console.log(dirs);来查看请求格式。

您会在dirs.request.origin下找到原点，dirs.request.destination下的目的地和dirs.request.waypoints下的航点。

要查找刚结束拖动的航点，请保留上一个请求（应该始终有一个，甚至在第一次拖动之前，因为您首先加载要编辑的路线）并搜索通过“一组航路点”的简单迭代，可以了解此前一个请求与当前请求之间的差异。我怀疑你们两者之间应该只有一个区别（无论你是引入新的航点还是移动现有航点）。那是你最后一次拖航的航点。

如何获得拖拽航点的纬度和长度

2 个答案: