カスタマイズされ、番号が付けられたアイコン+ Googleマップの情報ウィンドウApi 3

Question

最初に私はこれで新しく、Javascriptの知識をたくさん持っていないと言いたいと思います。ただウェブサイトを作成する必要がありますが、他の誰かが私のためにそれを支払う余裕はありません！

ビルドしようとしているのは、自分で作成した複数のマーカーを見つけることができるマップです。それらは20KB以下の.pngファイルです。 images/numbers /内の自分のサーバーにそれらをロードしました。私はおそらく、独自の情報ウィンドウでも、それぞれを50以上が必要となります

：彼らはこのようになります。

これは私が編集しようとしたが、それを動作させることができなかった例である：

https://developers.google.com/maps/documentation/javascript/tutorials/custom-markers?hl=es

ここで私がこれまで持っているJavaScriptコード：

 var map; 
    function initialize() { 
     map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 12, 
     center: new google.maps.LatLng(41.388426, 2.171339), 
     mapTypeId: 'roadmap' 

    }); 

    var iconBase = 'images/numbers/'; 
    var icons = { 
     001: { 
     icon: iconBase + '001.png' 
     }, 
     002: { 
     icon: iconBase + '002.png' 
     } 
    }; 

    function addMarker(feature) { 
     var marker = new google.maps.Marker({ 
     position: feature.position, 
     icon: icons[feature.type].icon, 
     map: map 
     }); 
    } 

    var features = [ 
     { 
     position: new google.maps.LatLng(41.388426, 2.171339), 
     type: '001' 
     }, { 
     position: new google.maps.LatLng(41.387815, 2.139496), 
     type: '002' 
     } 
    ]; 

    for (var i = 0, feature; feature = features[i]; i++) { 
     addMarker(feature); 
    } 
    } 

はあなたが助けることができる希望を！ Thankssss

Answer 1

私が見ることができる主な問題は、あなたのforループです。

はこれでそれを置き換えるようにしてください：

for (var i = 0, i<features.length; i++) { 
    addMarker(features[i]); 
} 

@MrUpsidownはコメントで述べたようにその後、あなたはicons配列に正しくオブジェクトを定義する必要があります。

var icons = { 
    '001': { 
    icon: iconBase + '001.png' 
    }, 
    '002': { 
    icon: iconBase + '002.png' 
    } 
}; 

featuresで、それは文字列として定義されているので、それはiconsで同じでなければなりません。

残りは大丈夫です。