0

ルートの描き方を学んでいます。これは、こちらの優れた投稿のおかげで達成されました。次のように、この例にウェイポイントを追加するのは簡単なプロセスだと思いました。

<!DOCTYPE html>
<html> 
<head> 
   <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
   <title>Google Maps API v3 Directions Example</title> 
   <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></head> 
<body style="font-family: Arial; font-size: 12px;"> 
   <div style="width: 600px;">
     <div id="map" style="width: 580px; height: 300px; float: left;"></div> 
   </div>

   <script type="text/javascript"> 

     var directionsService = new google.maps.DirectionsService();
     var directionsDisplay = new google.maps.DirectionsRenderer();

     var orig = new google.maps.LatLng(34.011689,-118.49633);
     var dest = new google.maps.LatLng(34.040818,-118.26815);


     //New coordinate defined below
     var wps1 = new google.maps.LatLng(34.069654,-118.44434);

    //Here is the waypoint 
    var waypts = [{ location: wps1, stopover: true }];

     var map = new google.maps.Map(document.getElementById('map'), {
       zoom:7,
       mapTypeId: google.maps.MapTypeId.ROADMAP
     });

     directionsDisplay.setMap(map);


     var request = {
             origin: orig, 
             destination: dest, 
             waypoints: waypts, //Adding the waypoint here 
             travelMode: google.maps.DirectionsTravelMode.DRIVING
     }



      directionsService.route(request, function(response, status) {
       if (status == google.maps.DirectionsStatus.OK) {
         directionsDisplay.setDirections(response);
       }
     });
   </script> 
</body> 
</html>

これをテストすると、ビーチから LA のダウンタウンへの非常に直接的なルートが表示されます。まずはUCLAへの寄り道を見せてもらうようにしています。

私はいくつかの Googleドキュメントをチェックアウトしましたが、私に関する限り. 上記で行ったことはうまくいくはずですか？コンピューターは嘘をつきませんが、それが何であれ、巧妙でなければなりません。

1.ウェイポイントを正しい形式で追加しました。 2. そのウェイポイントを処理するようリクエストに伝えました。

何がうまくいかないのですか？

4

1 に答える 1

1

このウェイポイントは LA の近くにはありません。

 var wps1 = new google.mapsLatLng(38.854782,-94.741055);

タイプミスがあります (マップと LatLng の間にピリオドがありません):

 var wps1 = new google.maps.LatLng(38.854782,-94.741055);

<!DOCTYPE html>
<html>
<head>
   <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
   <title>Google Maps API v3 Directions Example</title>
<script src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
</head>
<body>
   <div style="width: 600px;">
     <div id="map" style="width:600px; height:500px;"></div>
   </div>

   <script type="text/javascript">
     var directionsService = new google.maps.DirectionsService();
     var directionsDisplay = new google.maps.DirectionsRenderer();

     var orig = new google.maps.LatLng(34.011689,-118.49633);
     var dest = new google.maps.LatLng(34.040818,-118.26815);


     //New coordinate defined below
     var wps1 = new google.maps.LatLng(34.068921, -118.44518119999998);

    //Here is the waypoint
    var waypts = [{ location: wps1, stopover: true }];

     var map = new google.maps.Map(document.getElementById('map'), {
       zoom:7,
       center: wps1,
       mapTypeId: google.maps.MapTypeId.ROADMAP
     });

     directionsDisplay.setMap(map);


     var request = {
             origin: orig,
             destination: dest,
             waypoints: waypts, //Adding the waypoint here
             travelMode: google.maps.DirectionsTravelMode.DRIVING
     }



      directionsService.route(request, function(response, status) {
       if (status == google.maps.DirectionsStatus.OK) {
         directionsDisplay.setDirections(response);
       } else { alert("Directions Request failed: "+status); }
     });
   </script>
</body>
</html>

実施例

于 2013-07-01T21:09:55.387 に答える