Question

使用gmap3（jquery插件）显示Google地图界面。我正在尝试从JSON文件加载我的数据但由于某种原因它没有执行。地图显示，正在调用addMarkers（）函数，但如果我将console.log（）放在函数（数据）内的任何位置，它就不会显示。

我对这些匿名函数感到有些困惑，之前没有使用异步函数。任何建议都将不胜感激。

的Javascript

$(document).ready(function(){
  displayMap();
  addMarkers();
});


// Create map with options
function displayMap(){
  $('#map_canvas').gmap3({
   map: {
     options: mapOptions
   }          
  });
};

// Load data and add markers for each data point
function addMarkers(){
  $.getJSON( dataURL, function(data) {          
    $.each( data.markers, function(i, marker) {
      console.log( marker.lat + ':' + marker.lng + ':' + marker.data.category + ':' + marker.data.content );
    })
  });                  
};

JSON

{
markers: [
    { lat:-30, lng:145, data: {title: "Le Restaurant", category:"Restaurant", content:"Some French restaurant"} },
    { lat:-30, lng:145, data: {title :"Gem Cafe", category:"Cafe", content:"They sell coffee"} },
    { lat:-30, lng:145, data: {title :"Home", category:"Home", content:"Home sweet home."} }
  ]
}

Answer 1

愚蠢的我，只是使用http://jsonlint.com/检查了我的JSON格式，发现它格式不正确。我需要将'关键'名称括在引号中，如此......

{
"markers": [
    { "lat":-30, "lng":145, "data": {"title": "Le Restaurant", "category":"Restaurant", "content":"Some French restaurant"} },
    { "lat":-30, "lng":145, "data": {"title" :"Gem Cafe", "category":"Cafe", "content":"They sell coffee"} },
    { "lat":-30, "lng":145, "data": {"title" :"Home", "category":"Home", "content":"Home sweet home."} }
  ]
}

使用$ .getJSON从JSON加载地图数据

1 个答案: