顯示一個彈出氣球上的谷歌地圖標記

Question

我有下面的代碼顯示了客戶的郵政編碼，並且用記號筆標記在地圖上：

<?php if($_GET['postcode']){ ?> 

//alert(<?php echo $_GET['postcode'];?>) 

<?php }?> 

     function initialize() { 
     var mapOptions = { 
      zoom: 4, 
      center: new google.maps.LatLng("<?php echo $_GET['postcode'];?>"), 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 

     var map = new google.maps.Map(document.getElementById('map_canvas'),mapOptions); 
     map.setTilt(45); 


     var addressArray = new Array("<?php echo $_GET['postcode'];?>"); 
     var geocoder = new google.maps.Geocoder(); 

     var markerBounds = new google.maps.LatLngBounds(); 

     for (var i = 0; i < addressArray.length; i++) { 
     geocoder.geocode({ 'address': addressArray[i]}, function(results, status) { 
     if (status == google.maps.GeocoderStatus.OK) { 

     var marker = new google.maps.Marker({ 
     map: map, 
     position: results[0].geometry.location 
     }); 
     markerBounds.extend(results[0].geometry.location); 
     map.fitBounds(markerBounds); 

     } else { 
     alert("Geocode was not successful for the following reason: " + status); 
     } 
     }); 
     } 
     } 

     function loadScript() { 
     var script = document.createElement('script'); 
     script.type = 'text/javascript'; 
     script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&' + 
      'callback=initialize'; 
     document.body.appendChild(script); 
     } 

     window.onload = loadScript; 
    </script> 

我需要的是點擊標記時，是客戶訂購信息的彈出式泡泡。我需要添加什麼來顯示彈出窗口？

Answer 1

你需要在這裏讀了...

https://developers.google.com/maps/documentation/javascript/overlays

相信其基本原理是

var marker = new google.maps.Marker({ 
    position: myLatlng, 
    title:"Hello World!" 
}); 

Answer 2

退房信息窗口覆蓋： https://developers.google.com/maps/documentation/javascript/overlays#InfoWindows

差不多呢你想要什麼，就是說，它會顯示一個包含一些內容的氣球。

什麼，你將需要添加到您的代碼如下：

在腳本的開始，因爲一個全局變量：

var infowindow; 

在地圖API初始化：

function initialize() { 
    infowindow = new google.maps.InfoWindow(); 

創建標記後ER：

var marker = new google.maps.Marker({ 
    map: map, 
    position: results[0].geometry.location 
}); 

google.maps.event.addListener(marker, 'click', function() { 
    infowindow.setContent("<p>Some HTML content</p>"); 
    infowindow.open(map,marker); 
}); 

希望這有助於你