Googleマップ - 情報ウィンドウとマーカーの問題を出力するカスタムJS

Question

マーカと情報バブルを入れるGoogleマップのカスタムコードを単純化しようとしています。しかし、私はコードをデバッグすることができないいくつかの問題に遭遇したが、現在は何も出力していない。このコードでは、緯度/経度/タイトルとコンテンツを定義し、それらを地図上のマーカーとして出力しようとします。

<script type="text/javascript"> 

    function initialize() { 
    var myLatlng = new google.maps.LatLng(20,0); 
    var myOptions = { 
     zoom: 2, 
     center: myLatlng, 
     mapTypeId: google.maps.MapTypeId.TERRAIN 
    } 

    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

var countries = [ 
    {title:'Afghanistan', lat:34.28, lon:69.11, content:"<h2>Afghanistan</h2><p>16 Alumni</p>"}, 
    {title:'Albania', lat:41.18, lon:19.49, content:"<h2>Albania</h2><p>7 Alumni</p>"}, 
    {title:'Angola', lat:-8.5, lon:13.15, content:"<h2>Angola</h2><p>9 Alumni</p>"}, 
    {title:'Antarctica', lat:-80, lon:0, content:"<h2>Antarctica</h2><p>1 Alumnus</p>"}, 
    {title:'Antigua & Barbuda', lat:17.20, lon:-61.48, content:"<h2>Antigua & Barbuda</h2><p>1 Alumnus</p>"}, 
    {title:'Argentina', lat:-36.30, lon:-60, content:"<h2>Argentina</h2><p>29 Alumni</p>"}, 
]; 

for (i=0;i<countries.length;i++) 
{ 
    c = countries[i]; 
    marker: new google.maps.Marker({position: new google.maps.LatLng(" + c['lat'] + "," + c['lon'] + "), map: map, title: '" + c['title'] + "'}), 
    infowindow: new google.maps.InfoWindow({content: '" + c['content'] + "'}); 
} 

var item; 
for (var i=0; i<countries.length; i++) { 
    item = countries[i]; 
    google.maps.event.addListener(item.marker, 'click', makeCallback(item)); 
} 

function makeCallback(country) { 
    return function() { 
     country.infowindow.open(map, country.marker); 
    }; 
} 

}

</script> 

Answer 1

コード内の様々な表記と構文エラーがあります。また、変数の代わりに文字列を構築する必要はありません。以下は有効なバージョンです：

... 
var countries = [...]; 

for (var i = 0; i < countries.length; i++) { 
    var c = countries[i]; 
    c.marker = new google.maps.Marker({ 
     position: new google.maps.LatLng(c.lat, c.lon), 
     map: map, 
     title: c.title}); 
    c.infowindow = new google.maps.InfoWindow({content: c.content}); 

    google.maps.event.addListener(c.marker, 'click', makeCallback(c)); 
} 

function makeCallback(country) { 
    return function() { 
     country.infowindow.open(map, country.marker); 
    }; 
}