0

我在这里遇到了一个小问题,我想在我的谷歌地图 v3 上的点之间画一条线,当我给它 2 点时,响应中的状态结果是好的,但是当我发送 3 点或更多点时,结果是零,这是一个示例:

  <!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
html {
    height: 100%
}

body {
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0
}
</style>

<script type="text/javascript"
    src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
    var map;
    var marker;
    var firstLat;
    var firstLng;
    var secondLat;
    var secondLng;
    var latitude = 31.9565783;
    var longitude = 35.945695;
    var directionDisplay;
    var directionsService = new google.maps.DirectionsService();
    function initialize() {
        directionsDisplay = new google.maps.DirectionsRenderer();
        var amman = new google.maps.LatLng(latitude, longitude);
        var myOptions = {
            zoom : 10,
            center : amman,
            mapTypeId : google.maps.MapTypeId.ROADMAP

        }

        map = new google.maps.Map(document.getElementById("map_canvas"),
                myOptions);
        directionsDisplay.setMap(map);
        marker = new google.maps.Marker({
            position : amman,
            map : map,

        });
        console.log('before mM');
            //Here is the line that send the points to the map.
        moveMarker(32.024851, 35.877249, 31.56, 35.56, []);
        console.log('after mM');

    }
    function calcRoute(startLat, startLng, endLat, endLng, wayLoc) {

        console.log('enter calcRoute');
        console.log('startLat' + startLat);
        console.log('startLng' + startLng);
        console.log('endLat' + endLat);
        console.log('endLng' + endLng);
        var start = new google.maps.LatLng(startLat, startLng);
        //          document.getElementById('start').value;
        var end = new google.maps.LatLng(endLat, endLng);
        //          document.getElementById('end').value;
        console.log('start if stat');
        var waypts = [];
        if (wayLoc != null) {
            console.log('start for stat');
            for ( var i = 0; i < wayLoc.length; i++) {
                var pts = [];
                console.log(i + '1in for stat');
                console.log(wayLoc[i]);
                pts = wayLoc[i].split(":");
                console.log(i + '2in for stat');
                var latPoint = pts[0];
                console.log(i + '3in for stat');
                var lngPoint = pts[1];
                console.log(i + '4in for stat');
                var point = new google.maps.LatLng(latPoint, lngPoint);
                console.log('point' + point);
                console.log(i + '5in for stat');
                waypts.push({
                    location : point,
                    stopover : true
                });
                console.log(i + '6in for stat');
                console.log(start);
                console.log(end);
                console.log(waypts);
            }
        }
        console.log('verify req.');
        var request = {
            origin : start,
            destination : end,
            waypoints : waypts,
            optimizeWaypoints : true,
            travelMode : google.maps.DirectionsTravelMode.DRIVING
        };
        console.log(start);
        console.log(end);
        console.log(waypts);
        console.log('verify DS');
        directionsService.route(request, function(response, status) {
            console.log('in response');
            console.log('status:' + status);

            if (status == google.maps.DirectionsStatus.OK) {
                console.log('status ok');
                console.log(response);
                directionsDisplay.setDirections(response);
                console.log('set Dir done');
                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>';
                    console.log(summaryPanel.innerHTML);
                }
            }
            //          
            //  if (status == google.maps.DirectionsStatus.INVALID_REQUEST) {
            //              console.log("INVALID_REQUEST");
            //          }
            //          if (status == google.maps.DirectionsStatus.MAX_WAYPOINTS_EXCEEDED) {
            //              console.log("MAX_WAYPOINTS_EXCEEDED");
            //          }
            //          if (status == google.maps.DirectionsStatus.NOT_FOUND) {
            //              console.log("NOT_FOUND");
            //          }
            //          if (status == google.maps.DirectionsStatus.OVER - QUERY_LIMIT) {
            //              console.log("OVER - QUERY_LIMIT");
            //          }
            //          if (status == google.maps.DirectionsStatus.REQUEST_DENIED) {
            //              console.log("REQUEST_DENIED");
            //          }
            //          if (status == google.maps.DirectionsStatus.UNKNOWN_ERROR) {
            //              console.log("UNKNOWN_ERROR");
            //          }
            //          if (status == google.maps.DirectionsStatus.ZERO_RESULTS) {
            //              console.log("ZERO_RESULTS");
            //          }
            console.log('response is done');
        });
        console.log('calcRoute is Done');
    }

    function centerAt(latitude, longitude) {
        myLatlng = new google.maps.LatLng(latitude, longitude);
        map.panTo(myLatlng);
    }

    function moveMarker(startLat, startLng, endLat, endLng, wayLoc) {

        console.log(startLat);
        marker.setPosition(new google.maps.LatLng(startLat, startLng));
        map.panTo(new google.maps.LatLng(startLat, startLng));
        latitude = latitude;
        longitude = longitude;
        console.log('wayLoc: ' + wayLoc);
        calcRoute(startLat, startLng, endLat, endLng, wayLoc);

    };
</script>
<body onload="initialize();">
    <div id="map_canvas" style="width: 75%; height: 100%; float: left;"></div>

    <div id="control_panel"
        style="float: left; width: 25%; text-align: left; padding-top: 20px">

        <div id="directions_panel"
            style="margin: 20px; background-color: #FFEE77;"></div>
    </div>






</body>
</html>

当我调用此方法时: moveMarker(32.024851, 35.877249, 31.56, 35.56, []); 变化是:moveMarker(32.024851, 35.877249, 31.56, 35.56, ['32.321654:35.456321, 32.12:35.12']);

请帮忙..

4

1 回答 1

1

这两个路点距离道路不够近,DirectionsService 无法找到开车前往的路。

http://www.geocodezip.com/v3_example_geo2.asp?zoom=8&waypts=yes&addr1=(32.024851,35.877249)&addr2=(31.56,35.56)&waypt=(32.321654,35.456321)&waypt=(32.12,35.12)&geocode=1& 2

于 2013-04-16T10:10:44.510 回答