2011-08-18 59 views
1

我使用的是Google Maps API V3插件Infobox,我需要一些帮助。在代码中,循环在地图上创建了一些信息框,但我不知道如何从一开始就隐藏信息框?我试图改变isHidden值,但不工作。我还想知道如何在点击新标记以显示新信息框时隐藏信息前信息框?请提供一些帮助!谢谢!Google Maps API V3 Infobox插件隐藏/显示?

<!DOCTYPE html> 
<html> 
<head> 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
<script type="text/javascript" src="infobox.js"></script> 
<script type="text/javascript"> 
function initialize() { 
    var latlng = new google.maps.LatLng(55.672962361614566, 12.56587028503418); 

    var myMapOptions = { 
     zoom: 15 
     ,center: latlng 
     ,mapTypeId: google.maps.MapTypeId.ROADMAP 
     ,streetViewControl: false 
    }; 
    var theMap = new google.maps.Map(document.getElementById("map_canvas"), myMapOptions); 
// namn 
var name=[]; 
name.push('Test 1'); 
name.push('Test 2'); 

// positioner 
var position=[]; 
position.push(new google.maps.LatLng(55.667093265894245,12.581255435943604)); 
position.push(new google.maps.LatLng(55.66453963191134, 12.584795951843262)); 

// infoboxes 
var infobox = []; 
infobox.push("<div>Hello 1</div>"); 
infobox.push("<div>Hello 2</div>"); 

for (i = 0; i < position.length; i += 1) { 
// Call function 
createMarkers(position[i], infobox[i], name[i]); 
} 

function createMarkers(position,content,name) { 

    var marker = new google.maps.Marker({ 
     map: theMap, 
     draggable: false, 
     position: position, 
     visible: true, 
     title: name 
    }); 

    var boxText = document.createElement("div"); 
    boxText.style.cssText = "background: yellow; width: 300px; height: 70px; padding: 5px;"; 
    boxText.innerHTML = content; 

    var myOptions = { 
     content: boxText 
     ,disableAutoPan: false 
     ,maxWidth: 0 
     ,pixelOffset: new google.maps.Size(-37, -120) 
     ,zIndex: null 
     ,boxStyle: { 
      background: "url('tipbox.gif') no-repeat" 
      ,opacity: 1 
      ,width: "300px" 
     } 
     ,closeBoxMargin: "5px 5px 5px 5px" 
     ,closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif" 
     ,infoBoxClearance: new google.maps.Size(1, 1) 
     ,isHidden: false 
     ,pane: "floatPane" 
     ,enableEventPropagation: false 
    }; 

    google.maps.event.addListener(marker, "click", function (e) { 
     ib.open(theMap, this); 
    }); 

    var ib = new InfoBox(myOptions); 
    ib.open(theMap, marker); 

    } 

} 
</script> 

<title>Creating and Using an InfoBox</title> 
</head> 
<body onload="initialize()"> 
<div id="map_canvas" style="width: 100%; height: 400px"></div> 

回答

2

删除行:

ib.open(theMap, marker); 

而且信息框,直到您单击该标记应保持隐藏。