0

次のコードで複数のInfoWindowsを作成しようとしています。編集：明確にするために、すべてのウィンドウを同時に開く必要があります。

    for (var i = 0; i < 3; i++) {
      var markerOptions = {position:point[i], map:map};
      var marker = new google.maps.Marker(markerOptions);
      content = "Hello " + i;
      infowindow[i] = new google.maps.InfoWindow({content: content}); 
      google.maps.event.addListener(marker, 'mouseover', function()
      {
        infowindow[i].open(map,this);   
      });
    }

（完全なソース）

ただし、Chromeで次のエラーが発生します。UncaughtTypeError：undefinedのメソッド'open'を呼び出すことができません。

配列の代わりにプレーン変数「infowindow」を使用すると、単一のinfowindowが期待どおりに表示されます。

4

4 に答える 4

1

作成できる infoWindow は 1 つだけです。私はこのようなプロジェクトで使用しました:

var infowindow = new google.maps.InfoWindow();

for (var i = 0; i < 3; i++) 
{
    var markerOptions = {position:point[i], map:map, html:'Hello' };
    var marker = new google.maps.Marker(markerOptions);

    google.maps.event.addListener(marker, 'mouseover', function()
    {
        infowindow.setContent(this.html); // this is the trick: html attribute on markerOptions :), I used a array here
        infowindow.open(map,this);   
    });
}
于 2012-04-09T20:14:02.043 に答える
0

私が望むことを達成するために、私はクロージャが必要であることを学びました：

for (var i = 0; i < 3; i++) 
{
  (function(i) {
    var markerOptions = {position:point[i], map:map, html:'Hello' };
    var marker = new google.maps.Marker(markerOptions);

    google.maps.event.addListener(marker, 'mouseover', function()
    {
        infowindow.setContent(this.html); // this is the trick: html attribute on markerOptions :), I used a array here
        infowindow.open(map,this);   
    });
  })(i);
}
于 2012-04-13T14:47:41.653 に答える
0

infowindow[i] をコンソール (firebug) に出力して、期待どおりかどうかを確認しましたか? 一般的に、これを行う方法は、1 つの情報ウィンドウ オブジェクトを生成し、情報ウィンドウの内容を再利用/移動して変更することだと思います。

次のリンクが便利かもしれません: http://www.svennerberg.com/2009/09/google-maps-api-3-infowindows/

于 2012-04-09T20:13:03.353 に答える
0

作業サンプル

       var map;
      var mapOptions = { center: new google.maps.LatLng(0.0, 0.0), zoom: 2,
        mapTypeId: google.maps.MapTypeId.ROADMAP };
      var infowindow = new google.maps.InfoWindow();
      function initialize() {
        map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
        point = [];
        point[0] = new google.maps.LatLng(0.0,0.0);
        point[1] = new google.maps.LatLng(0.0,10.0);
        point[2] = new google.maps.LatLng(0.0,20.0);


          for (var i = 0; i < 3; i++) {
                var content = "Hello"+i;
                addInfowindows(point[i], content )             
          }
      }
function addInfowindows(point, content){


          var markerOptions = {position:point, map:map};
          var marker = new google.maps.Marker(markerOptions);


          google.maps.event.addListener(marker, 'mouseover', function()
          {
            infowindow.setContent(content);
            infowindow.open(map,this);   
          });


}
 google.maps.event.addDomListener(window, 'load', initialize);
于 2012-04-09T20:13:47.523 に答える