Javascript 未拾取标记位置-谷歌地图API v3

所以我试图找出两个标记之间的距离。在代码中，我左键单击一个标记，并将标记的位置保存到变量“start”。然后，我在左键单击上放置第二个标记，并将该标记的位置保存到可变端点。然后，我调用一个函数来计算标记之间的距离，但getPosition（）函数似乎没有以正确的格式拾取标记。我有点不明白为什么它不起作用

代码如下所示。任何帮助都将不胜感激。谢谢

var directionsDisplay;
var directionsService = new google.maps.DirectionsService();
var map;
var start;
var end;
var markersArray = [];
var originPlace = new google.maps.LatLng(0,0);
var destinationPlace = new google.maps.LatLng(0,0);

function initialize() {
  directionsDisplay = new google.maps.DirectionsRenderer();
  var chicago = new google.maps.LatLng(41.850033, -87.6500523);
  var mapOptions = {
    zoom:7,
    center: chicago
  }
  map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
  directionsDisplay.setMap(map);
  google.maps.event.addListener(map,'click',function(event) { 
    placeMarker(event.latLng); 
  }); 
}

function placeMarker(location) {
  if (markersArray.length == 0) {
            marker = new google.maps.Marker({
                position: location,
                map: map,
                title: location.toString()
            });

            // add marker in markers array
            markersArray.push(marker);
            start = marker.getPosition();
            alert(start);
        }
        else if(markersArray.length == 1)
        {
             marker = new google.maps.Marker({
                position: location,
                map: map,
                title: location.toString()
            });

            // add marker in markers array
            markersArray.push(marker);
            end = marker.getPosition();
            calcRoute(start, end);
        }
        else
        {

        }
}


function calcRoute(start, end) {
  originPlace = new google.maps.LatLng(start);
  destinationPlace = new google.maps.LatLng(end);

  var service = new google.maps.DistanceMatrixService();
  service.getDistanceMatrix(
    {
        origins: [originPlace],
        destinations: [destinationPlace],
        travelMode: google.maps.TravelMode.DRIVING
    }, callback);

}

function callback(response, status) {
  if (status != google.maps.DistanceMatrixStatus.OK) {
    alert('Error was: ' + status);
  } else {
    var origins = response.originAddresses;
    var destinations = response.destinationAddresses;
    var outputDiv = document.getElementById('outputDiv');
    outputDiv.innerHTML = '';

     for (var i = 0; i < origins.length; i++) {
      var results = response.rows[i].elements;
      for (var j = 0; j < results.length; j++) {
        outputDiv.innerHTML += origins[i] + ' to ' + destinations[j]
            + ': ' + results[j].distance.text + ' in '
            + results[j].duration.text + '<br>';
      }
    }
  }
}


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

var方向显示；
var directionsService=new google.maps.directionsService（）；
var映射；
var启动；
var端；
var-markersArray=[]；
var originPlace=new google.maps.LatLng（0,0）；
var destinationPlace=new google.maps.LatLng（0,0）；
函数初始化（）{
directionsDisplay=new google.maps.DirectionsRenderer（）；
var chicago=new google.maps.LatLng（41.850033，-87.6500523）；
变量映射选项={
缩放：7，
中心：芝加哥
}
map=new google.maps.map（document.getElementById（'map-canvas'），mapOptions）；
方向显示.setMap（地图）；
google.maps.event.addListener（映射，'click'，函数（事件）{
地点标记（事件标记）；
}); 
}
功能位置标记（位置）{
if（markersArray.length==0）{
marker=新的google.maps.marker({
位置:位置,，
地图：地图，
标题：location.toString（）
});
//在标记数组中添加标记
markersArray.push（marker）；
start=marker.getPosition（）；
警报（启动）；
}
else if（markersArray.length==1）
{
marker=新的google.maps.marker({
位置:位置,，
地图：地图，
标题：location.toString（）
});
//在标记数组中添加标记
markersArray.push（marker）；
end=marker.getPosition（）；
calcRoute（开始、结束）；
}
其他的
{
}
}
函数计算（开始、结束）{
originPlace=newgoogle.maps.LatLng（开始）；
destinationPlace=new google.maps.LatLng（end）；
var service=new google.maps.DistanceMatrixService（）；
service.getDistanceMatrix(
{
起源：[原籍]，
目的地：[目的地]，
travelMode:google.maps.travelMode.DRIVING
}，回调）；
}
函数回调（响应、状态）{
if（status！=google.maps.DistanceMatrixStatus.OK）{
警报（“错误为：”+状态）；
}否则{
var origins=response.originAddresses；
var destinations=response.destinationaddress；
var outputDiv=document.getElementById（'outputDiv'）；
outputDiv.innerHTML=''；
对于（变量i=0；i'；
}
}
}
}
google.maps.event.addDomListener（窗口“加载”，初始化）；

两点。首先，您在开始和结束时都这样做：

        marker = new google.maps.Marker({
            position: location,
            map: map,
            title: location.toString()
        });

        start = marker.getPosition(); 

为什么不直接使用您已经知道的

location

值，而不必调用getPosition（）

其次，start和end的值是LatLng对象，这是返回的值

在calcRoute函数中，然后尝试从它们创建LatLng对象，但这不起作用：

originPlace = new google.maps.LatLng(start);
destinationPlace = new google.maps.LatLng(end);

这应该是：

originPlace = start;
destinationPlace = end;

更新：此外，在构造

请求

对象时，您将originPlace和destinationPlace放入数组中，这会导致您在注释中提到的错误。这是我使用的代码，它对我有用

function placeMarker(location) {
    if (markersArray.length == 0) {
        marker = new google.maps.Marker({
            position: location,
            map: map,
            title: location.toString()
        });

        // add marker in markers array
        markersArray.push(marker);
        start = location;
    } else if (markersArray.length == 1) {
        marker = new google.maps.Marker({
            position: location,
            map: map,
            title: location.toString()
        });

        // add marker in markers array
        markersArray.push(marker);
        end = location;
        calcRoute(start, end);
    }
}


function calcRoute(start, end) {
    originPlace = start;
    destinationPlace = end;

    var request = {
        origin: originPlace,  // NOTICE THIS ONE ISN'T IN AN ARRAY...
        destination: destinationPlace,
        travelMode: google.maps.TravelMode.DRIVING
    };
    directionsService.route(request, function (response, status) {
        if (status == google.maps.DirectionsStatus.OK) {
            directionsDisplay.setDirections(response);
        }
    });

    var service = new google.maps.DistanceMatrixService();
    service.getDistanceMatrix({
        origins: [originPlace],  // ... BUT THIS ONE STILL IS
        destinations: [destinationPlace],
        travelMode: google.maps.TravelMode.DRIVING
    }, callback);
}

---

你能把它添加为JSFIDLE吗？嗨，安迪，谢谢你的关注。下面是JSFIDLE链接。嗨，邓肯，谢谢你的反馈。当我做出您建议的更改时，我得到了以下错误：Uncaught InvalidValueError:在属性源中：不是字符串，也不是LatLng或LatLngLiteral:在属性lat:不是数字有什么想法吗？完美邓肯！！万分感谢，我现在明白我的错误了！！

function placeMarker(location) {
    if (markersArray.length == 0) {
        marker = new google.maps.Marker({
            position: location,
            map: map,
            title: location.toString()
        });

        // add marker in markers array
        markersArray.push(marker);
        start = location;
    } else if (markersArray.length == 1) {
        marker = new google.maps.Marker({
            position: location,
            map: map,
            title: location.toString()
        });

        // add marker in markers array
        markersArray.push(marker);
        end = location;
        calcRoute(start, end);
    }
}


function calcRoute(start, end) {
    originPlace = start;
    destinationPlace = end;

    var request = {
        origin: originPlace,  // NOTICE THIS ONE ISN'T IN AN ARRAY...
        destination: destinationPlace,
        travelMode: google.maps.TravelMode.DRIVING
    };
    directionsService.route(request, function (response, status) {
        if (status == google.maps.DirectionsStatus.OK) {
            directionsDisplay.setDirections(response);
        }
    });

    var service = new google.maps.DistanceMatrixService();
    service.getDistanceMatrix({
        origins: [originPlace],  // ... BUT THIS ONE STILL IS
        destinations: [destinationPlace],
        travelMode: google.maps.TravelMode.DRIVING
    }, callback);
}