3

インフォウィンドウに問題があります。JSONを介してデータを取得するajax関数がありますが、別の関数を開いたときにインフォウィンドウを自動的に閉じることができません。私のコードはこれです：

var mapOptions = {
    center: new google.maps.LatLng(44.49423583832911, 11.346244544982937),
    zoom: 13,
    mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("mappa_locali"),mapOptions);
$.ajax({
    type:'GET',
    url:"locali_json.php"+urlz,
    success:function(data){ 
          var json = JSON.parse(data);
          for (var i=0; i<json.length; i++) {
             point = new google.maps.LatLng(json[i].latitudine,json[i].longitudine);
             var infowindow = new google.maps.InfoWindow;
             infowindow.setContent('<a href="./dettaglioLocale.php?id_loc='+json[i].id_locale+'">'+json[i].nome_locale+'</a><br>'+json[i].address);
             addMarkerz(point,infowindow);
          }
    }
})
 }


   function addMarkerz(point,infowindow) { 
    position: point,
    map: map
   });
    google.maps.event.addListener(marker,'mouseover',infoCallback(infowindow, marker));
    markers.push(marker);
    infos.push(infowindow);
     }

    function infoCallback(infowindow, marker) { 
      return function() {
         infowindow.close();  
        infowindow.open(map, marker);

      };
    }

どこで間違いが減ったか誰か知っていますか？それとも私に何かアドバイスはありますか？

4

3 に答える 3

9

提案は、(グローバル スコープで) 1 つの情報ウィンドウのみを作成し、それを再利用して、マーカーがクリックされたときにその内容を変更し、ユーザーがマップをクリックした場合は閉じることです。

コード スニペット (AJAX 呼び出しへの依存を削除します):

// global variables
var map;
var markers = [];
var infowindow = new google.maps.InfoWindow();

function initialize() {
  var mapOptions = {
    center: new google.maps.LatLng(44.49423583832911, 11.346244544982937),
    zoom: 13,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  map = new google.maps.Map(document.getElementById("mappa_locali"), mapOptions);
  var json = JSON.parse(data);
  for (var i = 0; i < json.length; i++) {
    point = new google.maps.LatLng(json[i].latitudine, json[i].longitudine);
    var infowindowHtml = '<a href="./dettaglioLocale.php?id_loc=' + json[i].id_locale + '">' + json[i].nome_locale + '</a><br>' + json[i].address;
    addMarkerz(point, infowindowHtml);
  }
}

function addMarkerz(point, infowindowHtml) {
  var marker = new google.maps.Marker({
    position: point,
    map: map
  });
  google.maps.event.addListener(marker, 'mouseover', infoCallback(infowindowHtml, marker));
  markers.push(marker);
}

function infoCallback(infowindowHtml, marker) {
  return function() {
    infowindow.close();
    // update the content of the infowindow before opening it
    infowindow.setContent(infowindowHtml)
    infowindow.open(map, marker);

  };
}


var data = JSON.stringify([{
  latitudine: 44.494887,
  longitudine: 11.3426163,
  id_locale: "0",
  nome_locale: "Bologna",
  address: "Bologna, Italy"
}, {
  latitudine: 44.4946615,
  longitudine: 11.314634999999953,
  id_locale: "0",
  nome_locale: "Quartiere Saragozza",
  address: "Quartiere Saragozza, Bologna, Italy"
}]);


google.maps.event.addDomListener(window, "load", initialize);
html,
body,
#mappa_locali {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}
<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="mappa_locali"></div>

于 2013-01-16T13:46:14.413 に答える
5 
function infoCallback(infowindow, marker) { 
  return function() {
     infowindow.close();  
    infowindow.open(map, marker);

  };
}

に変更する必要があります

function infoCallback(infowindow, marker) { 
    return function() {
        //Close active window if exists
        if (activeWindow != null) {
            activeWindow.close();
        }
        //Open new window 
        infowindow.open(map,marker); 
        //Store new window in global variable 
        activeWindow = infowindow; 
    };
}

.js ファイルでグローバル変数として activeWindow を として宣言しますvar activeWindow。

于 2013-10-01T11:37:53.470 に答える