谷歌地圖API：JSON到jQuery

我在使用Google Maps API V3顯示標記時遇到問題。谷歌地圖API：JSON到jQuery

這是我的JavaScript：

function getMap(zoom, center) { 
var myOptions = { 
    zoom: zoom, 
    center: center, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
}; 
var map = new google.maps.Map(document.getElementById("map"), myOptions); 

var marker = new google.maps.Marker({ position: centerBegin }) 
$.getJSON('json/markers.json', function (data) { 
    $.each(data, function (i, marker) { 

     var markerOptions = { map: map, position: new google.maps.LatLng(marker.latitude, marker.longtitude) , title: 'test'}; 
     var marker = new google.maps.Marker(markerOptions); 
     /*var marker = new google.maps.Marker({ 
      position: new google.maps.LatLng(marker.latitude, marker.longtitude), 
      content: i.toString(), 
      map: map, 
      title: 'test' 
     });*/ 
    }); 
});

}

這裏是我的JSON文件：

{"markers": [ 
    {"text":"Ondertekenen koopverkoopcontract", "latitude":-12.917239,  "longtitude":-38.48209}, 
    {"text":"Openen documentair krediet", "latitude":51.218584, "longtitude":4.40413}, 
    {"text":"Transport van producent naar haven Salvador", "latitude":51.22952, "longtitude":4.411617}, 
    {"text":"Vertrek naar haven Antwerpen", "latitude":-12.968114, "longtitude":-38.511543}, 
    {"text":"Aankomst haven Antwerpen + vertrek naar Transibel", "latitude":51.22952, "longtitude":4.411617}, 
    {"text":"Aankomst Transibel", "latitude":51.094863, "longtitude":4.12973}, 
    {"text" : "center point", "latitude":28.767659, "longtitude":-31.640625} 
]}

我看不到我的地圖任何標記。有人可以幫我弄這個嗎？

來源

2011-12-29 Sllix

我對谷歌地圖API不熟悉，但是''centerBegin'和';'在行尾是什麼地方？ – 2011-12-29 14:02:05

只是忘了評論一個:)但仍然沒有工作。 – Sllix 2011-12-29 14:05:38

您發佈的示例代碼有兩個問題。

遍歷data，當你真的要遍歷data['markers']。如果你看看你的JSON文件，你會發現它不是array，而是object，它的markers元素擁有標記信息的array。
過度使用變量，就像graphicdivine指出的那樣。

來源

2011-12-29 16:30:04 bamnet

謝謝！它現在有效。 – Sllix 2011-12-30 16:13:44

@Sixx，如果這個答案有效，你應該選擇這個作爲選擇的答案，點擊這個答案左邊的複選標記。 – jlafay 2012-01-03 19:22:14

看起來您在each循環內重新聲明，如下所示。

$.each(data, function (i, marker) { 
//--------------------------^ 
    // [...] 
    var marker = new google.maps.Marker(markerOptions); 
//--------^

來源

2011-12-29 12:39:55 graphicdivine

這可能是解決方案的一部分，但這並未解決問題。 – Sllix 2011-12-29 12:45:17

谷歌地圖API：JSON到jQuery

回答

相關問題