Google지도 정보 창 맞춤 설정

Question

Google지도 apiv3에서 infoWindow의 크기를 변경하는 데 어려움을 겪고 있습니다. 나는 여기서 문서를보고있다. - https://developers.google.com/maps/documentation/javascript/examples/infowindow-simple-max

그러나 나는 infoWidow의 너비와 높이를 변경할 수 없다. 콘텐츠가 기본 창에 큰 경우 추가 할 스크롤 막대를 제거 할 수 싶습니다. 이렇게하려면 창에 고정 된 높이와 너비를 지정합니다. 어떤 이유로 어떤 이유로 작동하지 않습니다. 나는이 추가 시도했습니다

var map; 
var bounds; 
var infowindow; 
var markersArray = []; 
var data; 
var image = '/img/markers/google_icon.png'; 

function initialize() { 
    console.log("Map Initialised"); 
    var myLatlng = new google.maps.LatLng(52.8382,-2.327815); 
    var mapOptions = { 
    zoom: 6, 
    center: myLatlng, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
    } 
    google.maps.visualRefresh = true; 
    map = new google.maps.Map(document.getElementById('maps-canvas-xx'), mapOptions); 
    bounds=new google.maps.LatLngBounds(); 
} 
function clearOverlays() { 
    for (var i = 0; i < markersArray.length; i++) { 
    markersArray[i].setMap(null); 
    } 
    markersArray = []; 
} 

function getMarker(event) { 
    console.log("Lookup requested."); 
    $('#code_search').text($('#PostcodePostcode').val()); 
    $('#address_search').show('slow'); 
    /* stop form from submitting normally */ 
    event.preventDefault(); 
    /* get some values from elements on the page: */ 
     var form_data = $(this).serialize(); 
     url = "http://weburl/location/a/", 
     $.ajax({ 
     crossDomain:true, 
     dataType: "jsonp", 
    url: url, 
    data : form_data, 
    success: function (data) { 
     clearOverlays(); 
    bounds = new google.maps.LatLngBounds(); 
     for (var i = 0; i < data.locations.length; i++) { 
     var latlng = new google.maps.LatLng(data.locations[i].lat,data.locations[i].lng); 
     var contentString = '<div id="infoWrap"><p>' + data.locations[i].name + '</p>' + 
       '<p style="font-size:8pt;">' + data.locations[i].address.replace(/,/g,',<br>') + '<br>' + data.locations[i].post_code + '<br>' + 
       data.locations[i].phone + '<br>' + '<a target="_blank" href="' + data.locations[i].url + '">' + data.locations[i].url + '</p></div>'; 

     var infowindow = new google.maps.InfoWindow({ 
        content: contentString, 
        }); 
     var marker = new google.maps.Marker({ 
        map: map, 
        position: latlng, 
        title:data.locations[i].name, 
      info: infowindow, 
      content: contentString, 
      icon: image, 
      }); 



     bounds.extend(latlng); 
     markersArray.push(marker); 
       google.maps.event.addListener(marker, 'click', function() { 
      marker.info.setContent(this.content); 
      marker.info.open(map, this); 
     }); 

      }//close each 
    map.fitBounds(bounds); 
     } 
    }); 
} 

:

여기에 구글 맵 내 JS입니다

var infowindow = new google.maps.InfoWindow({ 
        content: contentString, 
      width: "800px", 
        }); 

하지만 정보창의 폭과 높이를 변경할 수없는 것. 어떤 도움이라도 대단히 감사 할 것입니다.

감사합니다,

조쉬

Answer 1

는 InfoWindowOptions 객체에는 width 속성 단지의 maxWidth가 없습니다. 크기를 설정하려면 contentString의 HTML 마크 업에 일반 CSS를 사용하십시오. 당신

var infowindow = new google.maps.InfoWindow({ 
     content: '<div style="height:200px; width: 800px;">'+ contentString+'</div>'; 
    });