4

这是一个非常基本的问题,但请帮助,因为我尝试解决这 3 天,但我没有任何答案。我尝试了很多解决方案,但还是一样。

在这里,我有一个 nArray 函数,它返回一个 bigArray JSON,其中包含如下对象: bigArray

  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]

所以在这里我有“n”个对象。所有对象都包含 lat 和 lng。

我尝试使用基本的 google 示例解决我的问题:http: //jsfiddle.net/6Vz52/3/ 但在这里我遇到了一个问题,如何<option value使用我的代码中的 JSON(lat,lng) 数据在 google 示例中进行更改。

我试试这段代码:

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
    <script>
var directionsDisplay;
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 mapOptions = {
    zoom:7,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    center: chicago
  }
  map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
  directionsDisplay.setMap(map);
}

function calcRoute() {
  var start = document.getElementById('start').value;
  var end = document.getElementById('end').value;
  var request = {
      origin:start,
      destination:end,
      travelMode: google.maps.DirectionsTravelMode.DRIVING
  };
  directionsService.route(request, function(response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      directionsDisplay.setDirections(response);
    }
  });
}

google.maps.event.addDomListener(window, 'load', initialize);

    </script>

但我不知道在哪里以及如何放置我的 JSON (lat,lng) 数据并在地图上绘制多个方向。

如何在地图中显示带有对象坐标的方向?

更新:不需要的谷歌代码必须是这个(你可以放一些其他谷歌代码示例并与我的 json 集成),我只需要一个基于我的 JSON 数组绘制方向的解决方案

4

5 回答 5

1

您可以将纬度和经度放在以逗号分隔的起始值中。谷歌接受这一点,并在那里进行任何搜索。

所以你有类似的东西:

var start = lat + ',' + lng;

如果您需要即时更改选项值,您可以执行以下操作:

document.getElementById('start').value = lat + ',' + lng;
于 2013-08-12T19:11:56.307 回答
1

方向服务规范说

  • origin(必需)指定计算方向的起始位置。该值可以指定为字符串(例如“Chicago, IL”)或 LatLng 值。

  • 目的地(必需)指定要
    计算方向的终点位置。该值可以指定为字符串(例如“Chicago, IL”)或 LatLng 值。

因此有效的请求起点或终点值可能类似于“Bondi Beach”或“-33.890542,151.274856”(示例)

以下小提琴演示了与您的情况非常相似的情况。

这里给出的数据,

var latLngs = [{
    name: 'Bondi Beach',
    lat: -33.890542,
    lng: 151.274856
}, {
    name: 'Coogee Beach',
    lat: -33.923036,
    lng: 151.259052
}, {
    name: 'Cronulla Beach',
    lat: -34.028249,
    lng: 151.157507
}, {
    name: 'Manly Beach',
    lat: -33.80010128657071,
    lng: 151.28747820854187
}, {
    name: 'Maroubra Beach',
    lat: -33.950198,
    lng: 151.259302
}];

编辑

您可以将方向服务中的航路点用于多条链接路线。

更新的小提琴

希望这可以帮助。

于 2013-08-14T09:04:08.053 回答
1
here is short example: 

      function calculateDistances() {
      var service = new google.maps.DistanceMatrixService();
      for (var a=0; a<=length.array; a++){
      service.getDistanceMatrix(
        {
          origins: [arr[1][1], arr[1][2]],
          destinations: [arr[1][3], arr[1][4]],
          travelMode: google.maps.TravelMode.DRIVING,
          unitSystem: google.maps.UnitSystem.METRIC,
          avoidHighways: false,
          avoidTolls: false
        }, callback);
       }
}

完整教程是:https ://developers.google.com/maps/documentation/javascript/examples/distance-matrix

于 2013-08-16T05:04:01.607 回答
0

这是我用“shakib”
小提琴链接给出的数据创建的小提琴 。
可能会解决您的需求。
虽然如果您需要在航点上显示标记,您可以这样做,

        function addDirection(){

            if(i < yourLatLongs.length -1){
              var start = yourLatLongs[i].lat+","+yourLatLongs[i].lng;
              var end = yourLatLongs[i+1].lat+","+yourLatLongs[i+1].lng;

             var myLatlng = new google.maps.LatLng(yourLatLongs[i].lat,yourLatLongs[i].lng);

            var marker = new google.maps.Marker({
                position: myLatlng,
                map: map,
                title: 'Hello World!'
            }); 

              calcRoute(start,end);
              console.log(i);
              i++;
            }
        }


于 2013-08-19T09:40:50.350 回答
0

希望对你有帮助

https://developers.google.com/maps/documentation/javascript/directions#TravelModes

https://developers.google.com/maps/documentation/javascript/examples/directions-simple

您只需要起点和终点,无需绘制所有点。然后你想要你需要在很多部分中附加路径,比如从第一个点到第二个点,然后将它与另一个下一个点连接,依此类推,直到最后一个点连接......所以我认为这是你刚刚在两点之间绘制的谷歌设施第一和最后。

另一种方法是折线,但它不适合驾驶路线,它更适合飞行路线......希望您理解。好运

于 2013-08-14T13:24:25.383 回答