1

私はグーグルマップにこれらのマーカーを持っています。チェックボックスを使用して配列の「id」部分に応じて表示または非表示にできるようにする必要があります。

  var places = [  
  {  
    "title": "USA",  
    "description": "This is the united states",  
    "position": [ 39.639538,-104.414062 ],
    "id": "america"
  },  
  {  
    "title": "China",  
    "description": "This is the peoples republic of china",  
    "position": [ 34.016242,103.359375 ],
    "id": "asia"  
  }
]

.each（）methidを使用してマーカーを表示し、以下のjqueryを使用して、IDに応じてマーカーのオンとオフを切り替えようとしましたが、マーカーはそれを無視しているようです。どんな助けでも大歓迎です。

 var showAmerica = $("#showAmerica");
    google.maps.event.addDOMListener(showAmerica, 'click', function(){
        $('#america').toggle();
});

チェックボックスのHTML

<input type="checkbox" value="fund" id="showAmerica" />
4

2 に答える 2

1

この「id」属性は何ですか？MarkerOptionsには含まれていません。

いずれの場合も、Google Mapsオブジェクトを操作するには、jQueryではなくgMapsAPIを使用する必要があります。

たとえば、完全にテストされていないコードがいくつかありますが、それはあなたにアイデアを与えるはずです：

var markers = {
    "america" : [ new google.maps.Marker({ "display": false, "position": .... }) ],
    "china" : [ new google.maps.Marker({ "display": false, "position": ... }) ]
};

$('#americaButton').click(function () {
     for (var i = 0; i< markers["america"].length; i++)
         markers["america"][i].setDisplay(true);
});
于 2012-05-16T11:55:06.963 に答える
1

あなたのコードは、DOM要素ではなくjQueryオブジェクトを参照しています。実際のDOM要素を取得するのは簡単です。これは、DOMリスナーが引数として期待しているものです。.get(0)最初の引数のshowAmerica変数に追加するだけです。

var showAmerica = $("#showAmerica");
    google.maps.event.addDOMListener(showAmerica.get(0), 'click', function(){
        $('#america').toggle();
});

また、GoogleMapsAPIでDevToolsを使用する方法についてこのビデオをご覧になることをお勧めします。

于 2012-05-16T17:34:22.563 に答える