Question

我正在尝试使用Google地图创建一个公交地图（带有公交车/地铁指示），但是当我从输入创建“开始”和“结束”标记时（使用自动完成地址），就无法拖动任何地图尽管将drag选项设为true，仍然标记。

启用将travelMode选项更改为google.maps.TravelMode.DRIVING draggin'。然后将此属性返回google.maps.TravelMode.TRANSIT daggin'将恢复为禁用状态。

有办法解决这个问题吗？

代码：

  var directionsService;
  var directionsDisplay;

  function initMap() {
    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: 14,
      center: {lat: -32.89, lng: -68.845}  // Mendoza.
    });

    directionsService = new google.maps.DirectionsService;
    directionsDisplay = new google.maps.DirectionsRenderer({
      draggable: true,
      map: map,
      panel: document.getElementById('right-panel')
    });

    directionsDisplay.addListener('directions_changed', function() {
      var addresses = directionsDisplay.getDirections().routes[0].legs[0];
      document.getElementById('from').value = addresses.start_address;
      document.getElementById('to').value = addresses.end_address;
    });
    google.maps.event.addDomListener(document.getElementById('go'), 'click', displayRoute);

    var input_from = document.getElementById('from');
    var autocomplete = new google.maps.places.Autocomplete(input_from);
    autocomplete.bindTo('bounds', map);

    var input_to = document.getElementById('to');
    var autocomplete = new google.maps.places.Autocomplete(input_to);
    autocomplete.bindTo('bounds', map);

    displayRoute();
  }

  function displayRoute() {
    directionsService.route({
      origin: document.getElementById('from').value,
      destination: document.getElementById('to').value,
      //travelMode: google.maps.TravelMode.DRIVING,
      travelMode: google.maps.TravelMode.TRANSIT
    }, function(response, status) {
      if (status === google.maps.DirectionsStatus.OK) {
        console.log(response);
        directionsDisplay.setDirections(response);
      } else {
        alert('Could not display directions due to: ' + status);
      }
    });
  }      

  google.maps.event.addDomListener(window, 'load', initMap);

Answer 1

不幸的是，＆＃34; draggable＆＃34;模式不会被允许进入TRANSIT旅行模式。刚才我试图找到一种方法，顺便提一下我的问题。

修改

正如谷歌文档所说：

用户可以修改显示的骑行，步行或行车路线允许使用DirectionsRenderer，如果它们是可拖动的，则动态使用用户通过单击并拖动来选择和更改路径在地图上生成路径。您可以指示渲染器是否显示通过将其draggable属性设置为true来允许可拖动的方向。 过境路线不能拖延。

在此处查看：https://developers.google.com/maps/documentation/javascript/directions#TransitOptions

我们必须找到另一种方式......如果我发现它，我会告诉你，如果你先找到它我会感激你，如果你告诉我的话。

Answer 2

＆＃34;解决方案＆＃34; （hack）我发现，使用反复试验，是为了防止显示API创建的标记：

var directionsDisplay = new m.DirectionsRenderer({
    suppressMarkers: true, // Supressing the default markers
    map: map,

    // another options...

});

并实现我自己的功能来显示标记：

function placeMarker(e, t) {
    t < 2 && (markers[t] = new m.Marker({
        position: e,
        draggable: true,  // YES! It's draggable!
        map: map
    }), m.event.addListener(markers[t], "dragend", function() {
        geocodePosition(markers[t].getPosition(), t);
    }), markers[t].setVisible(true), geocodePosition(markers[t].getPosition(), t), arrangeBounds());
}

然后，使用谷歌公交地图可以拖动标记......解决方案已经很晚了，但我希望，尤其是。

Google公交地图上的可拖动标记

2 个答案: