我想设置一个信息窗口的大小以适合其中的内容。标准的信息窗口太宽了,我尝试使用maxWidth,但是它似乎不起作用。调整信息窗口大小的最佳方法是什么?

看到代码:

    window.setContent( inspStates[i].name+ "<br/>"+"total: "+inspStates[i].totalInsp+ "<br/>"+ info);


气泡中将显示的信息如下所示(\ n表示下一行)

纽约\ n总计60 \ n2009:10 \ n2010:20 \ n2011:30

最佳答案

您要做的是用您自己的替换“标准” Googlemaps infoWindow,然后将您的内容放入其中。替换了标准的GM infoWindow之后,您将拥有很大的自由度。我所做的是:

添加一个名为#infoWindow的新样式ID,并设置其宽度。

#infoWindow {
    width: 150px;
}


在Javascript中的任何函数之外,我创建了一个新的infoWindow:

var infoWindow = new google.maps.InfoWindow();


在函数内创建一个新的变量,该变量设置标记显示的信息,并将其值设置为内容:

var html = '<div id="infoWindow">';
html += 'NY<br />total 60<br />2009: 10<br />2010: 20<br />2011: 30';
html +='</div>';


使用您将在其他地方创建的位置信息调用createMarker函数,并将html var作为参数之一:

var marker = createMarker(point,name,html);


您将在其他地方声明的createMarker函数将所有信息汇总在一起,在地图上显示标记,并在单击时显示上方的信息:

function createMarker(latlng,name,html) {
    var contentString = html;
    var marker = new google.maps.Marker({
        position: latlng,
        map: map,
        title: name
        });

    google.maps.event.addListener(marker, 'click', function() {
        infoWindow.setContent(contentString);
        infoWindow.open(map,marker);
        });
}

07-24 09:44
查看更多