先closuresInfoWindow再打开另一个
大家晚上好,我写信是因为InfoWindow有问题。 我有一个通过JSON检索数据的ajax函数,但是当打开另一个时,我无法自动closuresInfoWindow。 我的代码是这样的:
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); }; }
有谁知道哪里下降的错误? 或者你有什么build议吗?
build议只创build一个infowindow(在全局范围内),当点击标记时重新使用它并更改它的内容,如果用户点击地图,则closures它。
代码片段(删除对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>
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; }; }
并声明activeWindow作为一个全局variables在你的js文件作为var activeWindow而这应该会对你有所帮助
我想我有一个简单的解决scheme。 我只保存最后一个打开的标记。 在下一次点击首先我closures最后一个标记。
var markers = []; var infowindows = []; function addMarkes(facilityID) { var bounds = new google.maps.LatLngBounds(); for (var i = 0; i < variants.length; i++) { var v = variants[i]; var position = new google.maps.LatLng(v.Lat, v.Long); bounds.extend(position); markers[i] = new google.maps.Marker({ position: position, title: v.Title, map: map, animation: google.maps.Animation.DROP, icon: v.Icon, infoWindowIndex: i //synchronize with infoWindows }); var localContent = '<div><span class="address">' + v.Address + '</span></div>'; infowindows[i] = new google.maps.InfoWindow({ content: localContent }); //Just for multiple marks. if (variants.length > 0) { var lastOpen = -1; //Save the last open mark google.maps.event.addListener(markers[i], 'click', function (innerKey) { return function () { //Close the last mark. if (lastOpen > -1) { infowindows[lastOpen].close(); } infowindows[innerKey].open(map, markers[innerKey]); lastOpen = innerKey; } }(i)); } } map.fitBounds(bounds); }