我正在努力改变google maps apiv3上infoWindow的大小。我一直在看这里的文档 - https://developers.google.com/maps/documentation/javascript/examples/infowindow-simple-max
但我似乎无法改变infoWidow的宽度和高度。我希望能够删除当内容对于默认窗口大时添加的滚动条。要做到这一点,我要给窗户一个固定的高度和宽度。由于某种原因,它不能正常工作。
这是我的谷歌地图JS:
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);
}
});
}
我尝试添加此内容:
var infowindow = new google.maps.InfoWindow({
content: contentString,
width: "800px",
});
但我似乎无法改变infoWindow的宽度和高度。任何帮助将不胜感激。
谢谢,
约什
答案 0 :(得分:2)
InfoWindowOptions对象中没有width属性,只有maxWidth。要设置大小,请在contentString中的HTML标记上使用普通css。
var infowindow = new google.maps.InfoWindow({
content: '<div style="height:200px; width: 800px;">'+ contentString+'</div>';
});