2014-10-20 61 views
0

我正在使用Google Map來繪製標記,並在有人點擊市場時出現一個小的彈出框。圖像被附上。默認情況下,Google已經設置了Popup的固定寬度,我想改變其大小。我在Documentation上沒有任何東西。如何在事件偵聽器中使用閉包時定義Google Map上的自定義大小

下面是我的代碼

 <script type="text/javascript"> 
    function initialize() { 
    var mapOptions = { 
     zoom: 5, 
     center: new google.maps.LatLng(-14.306407, -170.695018), 
     mapTypeId: google.maps.MapTypeId.TERRAIN 
    }; 
    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 

      var voyagePlanCoordinates = [    
     new google.maps.LatLng(), 
    ]; 

    var voyagePath<?php echo $voyage_id; ?> = new google.maps.Polyline({ 
     path: voyagePlanCoordinates, 
     geodesic: true, 
     strokeColor: "", 
     strokeOpacity: 1.0, 
     strokeWeight: 5 
    }); 
    voyagePath.setMap(map); 
    setMarkers(map, voyages); 
    } 

    var voyages = []; 

    function setMarkers(map, locations) { 
     var image = { 
     url: '/wp-content/themes/theme/resources/images/marker.png', 
     size: new google.maps.Size(20, 32), 
     origin: new google.maps.Point(0,0), 
     anchor: new google.maps.Point(0, 32) 
     }; 
     for (var i = 0; i < locations.length; i++) { 
     var voyage = locations[i]; 
     var myLatLng = new google.maps.LatLng(voyage[1], voyage[2]); 
     var marker = new google.maps.Marker({ 
      position: myLatLng, 
      map: map, 
      icon: image, 
      title: voyage[0], 
      zIndex: voyage[3] 
     }); 
       voyage_msg(marker, i); 
     } 
    } 
      function voyage_msg(marker, num){ 

       var message = []; 
       var infowindow = new google.maps.InfoWindow({ 
        content: message[num] 
      }); 
      google.maps.event.addListener(marker, 'click', function() { 
      infowindow.open(marker.get('map'), marker); 
     }); 
      } 
      google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 

請幫助!

enter image description here

+0

請提供[最小,**完整**,測試和可讀示例](http://stackoverflow.com/help/mcve) – geocodezip 2014-10-20 02:22:59

+0

這是最小代碼和直接點。大部分的東西,如PHP代碼已被剝離。 – 2014-10-20 02:25:46

+1

API不設置固定大小。大小取決於InfoWindow的內容和地圖的大小。使用CSS來強制自定義大小(但請注意API始終嘗試創建適合map-viewport的InfoWindow)。 – 2014-10-20 02:31:53

回答

1

你不需要任何額外的代碼或API調用來設置酥料餅的寬度。所有你需要的是基本的CSS

.map-closures{ 
     width: 200px; 
    } 

這應該做的伎倆。

+0

感謝它的作品。 – 2014-10-20 02:45:16

相關問題