【问题标题】:Failed in clear the route of the Direction Service in Google Map API 3在 Google Map API 3 中清除方向服务的路线失败
【发布时间】:2013-05-06 18:03:49
【问题描述】:

当我单击一个按钮通过清除标记和方向路线来重置地图时,我不确定用户是否已经创建了路线。如果在点击事件期间包含以下代码,我的功能将失效。但是如果去掉这三个代码就可以正常工作了……

directionsDisplay.setMap(null);
directionsDisplay.setPanel(null);
directionsDisplay.setDirections({routes: []});

在执行上述代码之前是否需要判断directionsDisplay是否为空?我的代码摘录如下,供您参考...非常感谢...

var directionsDisplay;
var directionsService = new google.maps.DirectionsService();
var StartMarker = null;
var EndMarker = null;
var directionsVisible = false;
var oldDirections = [];
var currentDirections = null;

google.maps.event.addListener(map, 'click', function(event) {
    if (!StartMarker) {
        origin = event.latLng;

        lat = origin.lat();
        lng = origin.lng();
        /*If the origin is null, run UpdateLatLng() function to convert 
          the Lat, Lng of the mouse click position to Northing, Easting and
          assign the value to the textbox */
        UpdateLatLng();

        var startimage = 'images/Start4.png';
        StartMarker = new google.maps.Marker({
            map: map,
            position: origin,
            icon: startimage
        });
    } else {
        //Relocate the Starting point and assign the new position to Textbox
        alert ("The starting point was relocated on screen"); 
        StartMarker.setMap(null);
        if (EndMarker !==null) {
            EndMarker.setMap(null);
        };
        directionsDisplay.setMap(null);
        directionsDisplay.setPanel(null);
        directionsDisplay.setDirections({routes: []});
        var origin = event.latLng;
        lat = origin.lat();
        lng = origin.lng();
        UpdateLatLng();
        //StartMarker.setPosition(origin.getposition());
        var startimage = 'images/Start4.png';
        StartMarker = new google.maps.Marker({
            map: map,
            position: origin,
            icon: startimage
        });
    }
});

google.maps.event.addListener(directionsDisplay, 'directions_changed',
        function() {
            if (currentDirections) {
                oldDirections.push(currentDirections);
                setUndoDisabled(false);
            }
            currentDirections = directionsDisplay.getDirections();
            calcRoute();
        });
function calcRoute() {
    if (origin == null) {
        alert("Please input the starting point");
        return;
    }

    var mode;
    switch (document.getElementById("mode").value) {
        case "driving":
            mode = google.maps.DirectionsTravelMode.DRIVING;
            break;
        case "walking":
            mode = google.maps.DirectionsTravelMode.WALKING;
            break;
        case "transit":
            mode = google.maps.DirectionsTravelMode.TRANSIT;
            break;
    }

    var request = {
        origin: origin,
        destination: destination,
        waypoints: waypoints,
        travelMode: mode,
        optimizeWaypoints: document.getElementById('optimize').checked,
        avoidHighways: document.getElementById('highways').checked,
        avoidTolls: document.getElementById('tolls').checked
    };

    directionsService.route(request, function(response, status) {
        if (status == google.maps.DirectionsStatus.OK) {
            directionsDisplay.setDirections(response);

        }
    });

    directionsVisible = true;
}

【问题讨论】:

  • 您应该使用您所使用的编程语言来标记您的问题,以进行标记和语法高亮。当你在它的时候修复你的代码缩进。
  • 非常感谢您的建议。希望问题能得到解决...
  • 什么是currentDirections?这在您的代码中未定义,UpdateLatLng 也是如此。
  • 谢谢... currentDirections 是在 html 的开头定义的,我只是在上面的编码中再次添加了它。UpdateLatLng 函数是另一个与 direcitonsService 无关的函数...所有其他该项目中的功能正常运行,但单击地图时无法删除路线。
  • 可能与路线服务无关,但没有它您的代码会失败...

标签: javascript html google-maps-api-3 google-maps-markers google-directions-api


【解决方案1】:

通过以下代码解决问题...

 if(directionsDisplay != null) { 
   directionsDisplay.setMap(null);
   directionsDisplay = null; }

【讨论】:

    【解决方案2】:
    directionsDisplay.setMap(null);
    map.setZoom(8);
    map.setCenter();
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2018-08-25
      • 2011-08-04
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2016-07-22
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多