[英]Google Maps v3 Centering and Infowindow control
I have a map that has checkboxes for users to select what they would like displayed on the map. 我有一个带有复选框的地图,供用户选择他们想要在地图上显示的内容。 Everything works well with the exception of the following two items. 除以下两项外,其他所有内容均正常运行。
When a user selects an item from the list the marker does display on the map, however the map does not re-center on the marker. 当用户从列表中选择一个项目时,标记确实会显示在地图上,但是地图不会重新位于标记的中心。 This is needed for a marker that is outside the viewable area of the map when the page loads. 当页面加载时,标记在地图的可见区域之外是必需的。
When I have multiple markers open on the map I would like to have only 1 infowindow open at a time, currently if I click on 10 markers there will be 10 infowindows open. 当我在地图上打开多个标记时,我一次只希望打开1个信息窗口,当前,如果我单击10个标记,则会打开10个信息窗口。 I would like to have it where if an infowindow is open and another marker is clicked then the first infowindow closes. 我想在打开信息窗口并单击另一个标记然后关闭第一个信息窗口的位置使用它。
I have pasted a snippet of the code for one of the markers below, any help would be greatly appreciated! 我为以下标记之一粘贴了一段代码,非常感谢您的帮助!
jQuery(document).ready(function(){
/**
* The Map object.
* @type {google.maps.Map}
*/
var mapOptions = {
center: new google.maps.LatLng(36.812946,-119.746953),
zoom: 16,
mapTypeId: google.maps.MapTypeId.SATELLITE
};
var map = new google.maps.Map(document.getElementById("map"), mapOptions);
/**
* The markers array.
* @type {Object}
*/
var markers = {};
markers.building37 = [];
var marker0237 = new google.maps.Marker({
visible: false,
icon: new google.maps.MarkerImage("images/website/brown_Marker.png",new google.maps.Size(32,37),null,null),
title: 'Building',
position: new google.maps.LatLng(36.80694607313768,-119.73590791225433),
center: position,
map: map
});
markers.building37.push(marker0237);
var info_window0237 = new google.maps.InfoWindow({
content: '<div id="infobubble"><div id="img"><img src="images/buildings/Foundation001.jpg" alt="Foundation Building"></div><div id="desc"><h3>Foundation</h3></div></div>',
maxWidth:350,
});
google.maps.event.addListener(marker0237, "click", function() {
info_window0237.open(map,marker0237);
});
var showBuilding37 = false;
var mgrBuilding37 = null;
/**
* Toggles Building 37 Marker Group visibility.
*/
function toggleBuilding37()
{
showBuilding37 = !showBuilding37;
if (showBuilding37)
for (var i=0; i < markers.building37.length; i++)
markers.building37[i].setVisible(true);
if (mgrBuilding37)
{
if (showBuilding37)
{
mgrBuilding37.addMarkers(markers.building37, 0);
mgrBuilding37.refresh();
}
else
{
mgrBuilding37.clearMarkers();
mgrBuilding37.refresh();
}
}
else
{
mgrBuilding37 = new MarkerManager(map, {trackMarkers: true, maxZoom: 15});
google.maps.event.addListener(mgrBuilding37, "loaded", function() {
if (showBuilding37)
{
mgrBuilding37.addMarkers(markers.building37, 0);
mgrBuilding37.refresh();
}
else
{
mgrBuilding37.clearMarkers();
mgrBuilding37.refresh();
}
});
}
}
google.maps.event.addDomListener(
document.getElementById("building37-cb"),"click", toggleBuilding37);
});
I don't see where you are setting the map center. 我看不到您在哪里设置地图中心。
You should do something like map.setCenter(location);
您应该执行类似map.setCenter(location);
when you add a marker. 当您添加标记时。
You should keep a list of info windows and when you display one, loop through the others and hide their info windows. 您应该保留一个信息窗口列表,当显示一个窗口时,循环浏览其他窗口并隐藏其信息窗口。
//Declare your info window array var infoWindows = new Array(); var info_window0237 = new google.maps.InfoWindow({ content: '<div id="infobubble"><div id="img"><img src="images/buildings/Foundation001.jpg" alt="Foundation Building"></div><div id="desc"><h3>Foundation</h3></div></div>', maxWidth:350, }); //After you make an infowindow, add it to the array infoWindows.push(info_window0237); google.maps.event.addListener(marker0237, "click", function() { //When you show an infowindow on click, hide the rest for(i = 0; i < indowWindows.length; i++) { //this will close all the infowindows you added to the array infoWindows[i].close(); } info_window0237.open(map,marker0237); });
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.