Jquery 从json向google地图添加多个标记

我正在尝试构建一个web应用程序，从服务器提取数据，并从JSON响应向google地图添加多个标记。这是JSON响应的样子：

{"key":[{"Latitude":"60.186518","Longitude":"24.950575"}...]}

我试图从中实现代码，但无法使其正常工作

这是我目前的代码：

    function success(position) {
  var mapcanvas = document.createElement('div');
  mapcanvas.id = 'mapcontainer';
  mapcanvas.style.height = '600px';

  document.querySelector('article').appendChild(mapcanvas);
  var coords = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
  var options = {
    zoom: 15,
    center: coords,
      panControl: false,
  zoomControl: false,
  mapTypeControl: false,
  scaleControl: false,
  streetViewControl: false,
  overviewMapControl: true,

    navigationControlOptions: {
      style: google.maps.NavigationControlStyle.SMALL
    },
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  var map = new google.maps.Map(document.getElementById("mapcontainer"), options);
  var marker = new google.maps.Marker({
      position: coords,
      map: map,
      title:"You are here!"});

 function getLocations() {

    $.getJSON("http://myurl.com/jsonresponse", function (json) {

        var location;


        $.each(json.key, function (i, item) {
            addMarker(item.Latitude,item.Longitude);
        });

    });
}

function addMarker(lat,lng) {
        marker = new google.maps.Marker({
            position: new google.maps.LatLng(lat,lng),
            map: map,
        });
        markersArray.push(marker);
}

}
if (navigator.geolocation) {
  navigator.geolocation.getCurrentPosition(success);
} else {
  error('Geo Location is not supported');
}

请试试这个：

---

另一方面，在addMarker功能中使用console.log（lat，lng）并在此处复制输出。

什么不起作用？如果调试，会出现哪些错误？如果有很多标记，我建议您使用KML文件…当前我有36个标记。我似乎没有任何错误。我认为addmarker函数有问题，但我不确定。当我像这样向addmarker添加console.log时：

function addmarker（lat，lng）{console.log（lat，lng）marker=new google.maps.marker（{position:new google.maps.LatLng（lat，lng），map:map，}）；markersArray.push（marker）；}

它不会在控制台上显示任何内容？如果在ajax请求的success函数之后放置console.log（data.key），那么首先触发getLocations（）函数怎么样。我现在明白了，在你的代码中，你没有启动它。创建标记后调用它；getLocations（）；那是个愚蠢的错误。。。。但现在我得到了错误：

ReferenceError:markersArray未定义[Break On This error]…pc]&（c.gallerymg=“no”）；e、 b？um（c，e.b）：（qk（c[A]，“0px”），Mj（c[A]，“0px”），Vj（c[A]，“0…”只需在顶部声明它；var markersArray；但我认为您可以注释该行，因为您的示例没有使用它！
      function getLocations() {
            $.ajax({
              url: 'http://myurl.com/jsonresponse',
              async:false,
              success: function(data) {
                 $.each(data.key, function(index) {
                    addMarker(data[index].Latitude,data[index].Longitude);
                  });
              }
            }); 
        }