0

マップ上に描画方向を描画するコードを作成しましたが、ウェイポイントでは8つのポイントしか表示できないため、ポリラインを使用しています。

まずnArray()、このコンソールに表示されているような値を返す関数があります。

 Array[5]
    0: Object
    1: Object
         DISTANCE_FROM_PREVIOUS_OBJECT_LOCATION: 2.087970147789207
         lat: "48.866588"
         leftPosition: 183
         lng: "2.309037999999987"
         topPosition: 57
            __proto__: Object
    2: Object
    3: Object
    4: Object
    length: 5
    __proto__: Array[0]

今、すべてのオブジェクト (緯度、経度) をポイントとして設定したい:

<!DOCTYPE html>
<html>
    <head>
        <script src="http://maps.google.com/maps/api/js?sensor=false&libraries=places" type="text/javascript"></script>
        <script>
        var map = null;
        var directionService = null;
        var directionsRenderer = null;

        var bigArray = nArray();

        function initialize() {
          var mapOptions = {
            center: new google.maps.LatLng(35.75936182169444, -90.35907120698232),
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            zoom: 4
          };
          map = new google.maps.Map(document.getElementById("map"), mapOptions);
          directionService = new google.maps.DirectionsService();
          directionsRenderer = new google.maps.DirectionsRenderer({ map: map });      
        }

        function drawDirections(myPath) {
            var myLine = new google.maps.Polyline({
                path: myPath,
                strokeColor: '#ff0000',
                strokeOpacity: 1.0,
                strokeWeight: 2
            });
            myLine.setMap(map);
        }

        function drawRoutes() {
            var i;
            var npts = bigArray.length - 1;

            for (i = 0; i < npts; i++) {
                var marker = new google.maps.Marker({
                  map: map,
                  position: new google.maps.LatLng(bigArray[i].lat, bigArray[i].lng)
                });
                var request = {
                  origin: new google.maps.LatLng(bigArray[i].lat, bigArray[i].lng),
                  destination: new google.maps.LatLng(bigArray[i + 1].lat, bigArray[i + 1].lng),
                  travelMode: google.maps.DirectionsTravelMode.DRIVING
                }

                directionService.route(request, function(result, status) {
                    //route = result.routes[0];
                    if (status == google.maps.DirectionsStatus.OK) {
                        drawDirections(result.routes[0].overview_path);
                    }
                });
            }

            var marker = new google.maps.Marker({
              map: map,
              position: new google.maps.LatLng(bigArray[i].lat, bigArray[i].lng)
            });
        }
        </script>
    </head>
    <body onload="initialize();">
        <div id="map" style="width: 500px; height: 400px;"></div>
        <input type="button" onclick="drawRoutes()" value="Draw Routes" />
    </body>
</html>

からすべてのオブジェクトの緯度と経度を取得する方法はnArray?

4

1 に答える 1

0

現在、ループ内のすべてのオブジェクトの緯度と経度を既に取得していますが、2 つの問題があります。

  1. ウェイポイントで DirectionsRenderer を使用した場合と同じ結果を得るには、結果 (例result.routes[0].legs[0].start_location) を使用してマーカーの位置を設定する必要があります。そうしないと、マーカーがルートに配置されません。

  2. waypoints-limit を超えるためにこのアプローチを忘れる必要があります。1 秒あたり 10 リクエストの制限があり、すぐに "OVER_QUERY_LIMIT" という応答が返されます。

于 2013-08-18T01:20:31.170 に答える