2012-10-12 29 views
5

我正在搞亂Google Maps API,我似乎無法弄清楚如何在有人點擊自定義地圖後在地圖上添加彈出信息我已添加的圖標。我正在使用的代碼是下面和一個例子是在littlemarketbrasserie.comGoogle Maps API自定義彈出式菜單

任何幫助將不勝感激。

<script type="text/javascript"> 
     function initialize() { 
     var mapOptions = { 
      zoom: 15, 
      panControl: false, 
      mapTypeControl: false, 
      center: new google.maps.LatLng(41.89924, -87.62756), 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     } 
     var map = new google.maps.Map(document.getElementById('map_canvas'), 
             mapOptions); 

     var image = 'img/lm-logo-maps1.png'; 
     var myLatLng = new google.maps.LatLng(41.89924, -87.62756); 
     var marker = new google.maps.Marker({ 
      position: myLatLng, 
      map: map, 
      animation: google.maps.Animation.DROP, 
      icon: image, 
     }); 

     var styles = [ 
        { 
        stylers: [ 
         { hue: "#ff9f67" }, 
         { saturation: -20 }, 
         { gamma: 1.50 } 
        ] 
        },{ 
        featureType: "road", 
        elementType: "geometry", 
        stylers: [ 
         { lightness: 100 }, 
         { visibility: "simplified" } 
        ] 
        },{ 
        featureType: "road", 
        elementType: "labels.text.stroke", 
        stylers: [ 
         { visibility: "off" } 
        ] 
        }, 

        { 
        featureType: "water", 
        elementType: "geometry.fill", 
        stylers: [ 
         { visibility: "on" }, 
         { color: "#ffa066" }, 
         { lightness: 80 } 
        ] 
        } 
       ]; 

       map.setOptions({styles: styles}); 
     } 
    </script> 

回答

6

如果你在談論infowindow那麼您可以將您initialize功能

var popup=new google.maps.InfoWindow({ 
    content: "Hello" 
}); 
google.maps.event.addListener(marker, 'click', function(e) { 
    // you can use event object as 'e' here 
    popup.open(map, this); 
}); 

DEMO內使用。

此外,如果你想添加一個自定義風格的infowindow那麼你可以看看thisthis example使用jQuery對話框。

相關問題