Googleマップに複数のマーカーが付いています

Question

複数のマーカー（ここに記載されている：http://google-maps-utility-library-v3.googlecode.com/svn/tags/markerwithlabel/1.0.1/docs/examples.html）を実装したいのですが、コードの作成に問題があります。あなたは、次のコードを使用する必要があるだろう例えば2つのマーカーの

：

var latlng1 = new google.maps.LatLng(49, -123); 
var latlng2 = new google.maps.LatLng(48, -123); 

var marker1 = new MarkerWithLabel({ 
     position: latlng1, 
     draggable: true, 
     map: map, 
     labelContent: "abcd", 
     labelAnchor: new google.maps.Point(22, 0), 
     labelClass: "labels", 
     labelStyle: {opacity: 0.75} 
    }); 

var marker2 = new MarkerWithLabel({ 
     position: latlng2, 
     draggable: true, 
     map: map, 
     labelContent: "efgh", 
     labelAnchor: new google.maps.Point(22, 0), 
     labelClass: "labels", 
     labelStyle: {opacity: 0.75} 
    }); 

これはOKですが、どのようなマーカーは約10？私はこのような何かをできるようにしたいと思います：

var locations = [ 
    new google.maps.LatLng(49, -123), 
    new google.maps.LatLng(48, -123), 
    ]; 

var labels = [ 
    "abcd", 
    "efgh", 
    ]; 

問題は、私は「のための」関数を書くとき、マップは任意のマーカーが表示されないということです。

for (var i = 0; i < locations.length; i++) 
{ 
    var marker = new MarkerWithLabel({ 
     position: locations[i], 
     draggable: true, 
     labelContent: labels[i], 
     labelAnchor: new google.maps.Point(22,0), 
     labelClass: "labels", 
     labelStyle: {opacity: 0.85}}); 
} 

私はプログラミングにあまりよくないので、間違っていることを教えてください。

この後、もちろん情報ウィンドウを追加するという問題がありますが、後でそれについて話しましょう。

ありがとうございます。これが重要な理由は、あなたがあまりにもマーカーを追加するためにどのようなマップMarkerWithLabelを伝える必要があるということです

：あなたのforループあなたが「真ドラッグ」の下に

map: map, 

を含めるのを忘れて

Answer 1

。ページには複数の地図があるかもしれません。

Answer 2

返信いただきありがとうございます。 はい、私は上記のスレッドにmapパラメータを含めるのを忘れていました - 私はコード内に持っていました。

は問題が実際にマーカーにアイコンを関連付けるとしなければならなかった：

02、03などに続く

new google.maps.MarkerImage('http://google-maps-icons.googlecode.com/files/black01.png') 

私はこのように、それに応じて配列を書いていないコードは、実際にはマーカ部にそれを作ったことがありません（それはOKだった）。

機能についての内容は、次のようになります。

var marker = new MarkerWithLabel({ 
     position: locations[i], 
     draggable: true, 
     map: map, 
     icon: icons[i], 
     labelContent: labels[i], 
     labelAnchor: new google.maps.Point(22,0), 
     labelClass: "labels", 
     labelStyle: {opacity: 0.85}}); 

Answer 3

ループする前に、まず配列としてマーカーを宣言する必要があります。

var marker = new Array(); 

だけループ内MarkerwithLabelクラスとして割り当てる

for (var i = 0; i < locations.length; i++) 
{ 
    marker = new MarkerWithLabel({ pro}) 

} 

Answer 4

詳細については、この記事や参照のウェブサイトを見てみましょう：

Multiple marker with labels in google map

<script type="text/javascript"> 
//Generate Markers Value Array 
var markers = [ 
<asp:Repeater ID="rptMarkers" runat="server"> 
<ItemTemplate> 
      { 
      "title":'<%# Eval("Area") %>', 
      "lat": '<%# Eval("Latitute") %>', 
      "lng": '<%# Eval("Longitute") %>', 
      "description": '<%# Eval("Address") %>' 
     } 
</ItemTemplate> 
<SeparatorTemplate> 
    , 
</SeparatorTemplate> 
</asp:Repeater> 
]; 

</script> 

//

for (i = 1; i <= markers.length; i++) { 
    var data = markers[i-1] 
    var myLatlng = new google.maps.LatLng(data.lat, data.lng); 

    var marker = new MarkerWithLabel({ 
     position: myLatlng, 
     map: map, 
     title: data.title, 
     labelContent: i, 
     labelAnchor: new google.maps.Point(7, 30), 
     labelClass: "labels", // the CSS class for the label 
     labelInBackground: false 
    }); 

    (function (marker, data) { 
     google.maps.event.addListener(marker, "click", function (e) { 
      infoWindow.setContent(data.description); 
      infoWindow.open(map, marker); 
     }); 
    })(marker, data); 

    } 

参考：

Multiple marker with labels in google map with Asp.net