11

Googleマップで経度緯度をウェイポイントとして使用しようとしていますが、機能していないようです。

これが私の価値観をプッシュする方法です

waypts_mtlsheloc.push({
    location: (45.658197,-73.636333), //I don't think I'm supposed to write this like that. But can't find the right way.
    stopover: true
})

そして、このように私の行を変更してみてください

service.route({
    origin: latlng_mtlsheloc[0],
    destination: latlng_mtlsheloc[latlng_mtlsheloc.length - 1],
    waypoints:waypts_mtlsheloc,
    travelMode: google.maps.DirectionsTravelMode.DRIVING
}, function(result, status) {
        console.log(status)
        if (status == google.maps.DirectionsStatus.OK) {
        path = path.concat(result.routes[0].overview_path);
        line_mtlsheloc.setPath(result.routes[0].overview_path);
    }
});

しかし、「プロパティ[ウェイポイント]のエラー」というエラーが表示されます。場所を書き留めるさまざまな方法を試しましたが、正しい方法が見つからないようです。

4

1 に答える 1

25

緯度と経度をウェイポイントとして使用するには、google.maps.LatLng オブジェクトである必要があります (ドキュメントには文字列または LatLng と記載されています。文字列は住所、LatLng は地理座標です)。

waypts_mtlsheloc.push({
    location: new google.maps.LatLng(45.658197,-73.636333),
    stopover: true
})

実施例

jsfiddle

コードスニペット：

var directionDisplay;
var directionsService = new google.maps.DirectionsService();
var map;

function initialize() {
  directionsDisplay = new google.maps.DirectionsRenderer();
  var chicago = new google.maps.LatLng(41.850033, -87.6500523);
  var myOptions = {
    zoom: 6,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    center: chicago
  }
  map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
  directionsDisplay.setMap(map);
  calcRoute();
}

function calcRoute() {

  var request = {
    origin: "1521 NW 54th St, Seattle, WA 98107 ",
    destination: "San Diego, CA",
    waypoints: [{
      location: new google.maps.LatLng(42.496403, -124.413128),
      stopover: false
    }],
    optimizeWaypoints: true,
    travelMode: google.maps.DirectionsTravelMode.WALKING
  };
  directionsService.route(request, function(response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      directionsDisplay.setDirections(response);
      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 />";
      }
    } else {
      alert("directions response " + status);
    }
  });
}

google.maps.event.addDomListener(window, "load", initialize);
html {
  height: 100%
}

body {
  height: 100%;
  margin: 0px;
  padding: 0px
}
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk"></script>
<div id="map_canvas" style="float:left;width:70%;height:100%;"></div>
<div id="control_panel" style="float:right;width:30%;text-align:left;padding-top:20px">
  <div id="directions_panel" style="margin:20px;background-color:#FFEE77;"></div>
</div>

于 2012-10-03T16:01:47.557 に答える