无法使用Google Maps API v3计算道路距离

时间:2013-10-19 07:32:03

标签: javascript google-maps google-maps-api-3

运行以下代码时出现两个错误: 1.未捕获的InvalidValueError:setPosition的无效参数:[object Object] 2.未捕获的TypeError:无法调用未定义的方法'contains'

编辑:我可以使用相同的标记标签创建多个标记,如下所示吗?

基本上尝试将标记添加到一组lat-longs并计算到公共点的距离:

<script type="text/javascript">
        var map;
        var mapOptions;
        var lat = [33, 34, 35, 36];
        var lon = [-84, -86, -89, -100];
        var src = [30, -90];
        var dist = [];
        var marker;
        var directionsService = new google.maps.DirectionsService();
        var directionsRequest;
        var directionsRenderer;
        var markerPoints =  [{"location": new google.maps.LatLng(lat[0], lon[0])}, 
                             {"location": new google.maps.LatLng(lat[1], lon[1])},
                             {"location": new google.maps.LatLng(lat[2], lon[2])},
                             {"location": new google.maps.LatLng(lat[3], lon[3])}];

          function initialize() {
            directionsRenderer = new google.maps.DirectionsRenderer();
            mapOptions = {
              center: new google.maps.LatLng(33.75, -84.39),
              mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            map = new google.maps.Map(document.getElementById("map-canvas"),
                    mapOptions);
            directionsRenderer.setMap(map);

            marker = new google.maps.Marker({
                 position: new google.maps.LatLng(src[0], src[1]),
                 //icon: 'http://maps.google.com/mapfiles/marker.png',
                 map: map
              });

            for(var iter = 0; iter < lat.length; iter++)
            {
                placeMarker(iter);
                getDistances(iter);
            }
          }

          function placeMarker(iter)
          {
                 marker = new google.maps.Marker({
                 position: markerPoints[iter],
                 //icon: 'http://maps.google.com/mapfiles/marker_green.png',
                 map: map
              });
          }

          function getDistances(iter)
          {
              directionsRequest = {
                    origin: new google.maps.LatLng(src[0], src[1]),
                    destination: markerPoints[iter],
                    travelMode: google.maps.TravelMode.DRIVING,
              };

              directionsService.route(directionsRequest, function(response, status){
                  if(status == google.maps.DirectionsStatus.OK)
                      {
                            dist.push(response.routes[0].legs[0].distance);
                      }
                  else
                      {
                        alert("Impossible");
                      }
              });
          }

        google.maps.event.addDomListener(window, 'load', initialize);
        </script>

1 个答案:

答案 0 :(得分:1)

你去......

问题#1:未捕获的InvalidValueError:setPosition的无效参数:[object Object]

您的markerPoints数组存在问题。而不是

var markerPoints =  [{"location": new google.maps.LatLng(lat[0], lon[0])}, 
                     {"location": new google.maps.LatLng(lat[1], lon[1])},
                     {"location": new google.maps.LatLng(lat[2], lon[2])},
                     {"location": new google.maps.LatLng(lat[3], lon[3])}];

应该是......

 var markerPoints = [new google.maps.LatLng(lat[0], lon[0]),
                     new google.maps.LatLng(lat[1], lon[1]),
                     new google.maps.LatLng(lat[2], lon[2]),
                     new google.maps.LatLng(lat[3], lon[3])];

问题#2:未捕获的TypeError:无法调用未定义的方法'contains':

如果您使用实验api版本(v = 3.exp)进行map api,那么您将遇到此问题。您还应该使用任何发行版本。您可以访问Google Map API Version information section

查找不同版本的详细信息

希望这会对你有所帮助。