1

我面临解决信息窗口大小的巨大问题。我想在信息窗口中显示一个图像块和一些文本信息,但是在内容信息窗口大小增加之后,我已经阅读了一些线程,但我的代码没有运气。谁能帮我整理一下。

// Creating an object literal containing the properties 
// we want to pass to the map  
var options = {  
  zoom: 5,  
  center: new google.maps.LatLng(44.913990, 15.205078),  
  mapTypeId: google.maps.MapTypeId.ROADMAP ,
  };
// Creating the map  
var map = new google.maps.Map(document.getElementById("map"), options);
// Creating a LatLngBounds object
var bounds = new google.maps.LatLngBounds();
// Creating an array that will contain the coordinates 
// for New York, San Francisco, and Seattle
  var content = [];
  var places = [];content.push('Some html');
  places.push(new google.maps.LatLng(44.913990, 15.205078));
// Creating a variable that will hold 
// the InfoWindow object
var infowindow;

// Looping through the places array
for (var i = 0; i < places.length; i++)
{
  // Adding the markers
  var marker = new google.maps.Marker({
    position: places[i], 
    map: map,
    icon: "/themes/garland/images/beach_icon_gmap.png"
  //  title: "Place number " + i
  });

  // Wrapping the event listener inside an anonymous function 
  // that we immediately invoke and passes the variable i to.
  (function(i, marker) {
    // Creating the event listener. It now has access to the values of
    // i and marker as they were during its creation
    google.maps.event.addListener(marker, "click", function() {

      // Check to see if we already have an InfoWindow  
      if (!infowindow) {
        infowindow = new google.maps.InfoWindow({
            maxWidth: 20,
            maxheight: 20
        });
      }

      // Setting the content of the InfoWindow
      infowindow.setContent(content[i]);

      // Tying the InfoWindow to the marker 
      infowindow.open(map, marker);

    });

  })(i, marker);

  // Extending the bounds object with each LatLng
  bounds.extend(places[i]);
}
// Adjusting the map to new bounding box
// map.fitBounds(bounds)

任何帮助将不胜感激。提前致谢。

4

1 回答 1

0

我在您的代码中注意到的第一件事:是传递给构造函数的api-doc对象maxWidth的有效属性,但不是。尽管会限制宽度,但您将无法将其视为严格或刚性容器。An的大小始终包含它所提供的任何内容。从 API 文档:InfoWindowOptionsInfoWindowmaxheightInfoWindowmaxWidthInfoWindow

InfoWindow 将根据内容调整大小。要为内容设置显式大小,请将内容设置为具有该大小的 HTML 元素。

也就是说,您可以InfoWindow通过定义 CSS 类并将样式规则应用于窗口内容来控制窗口的大小、显示、颜色等。对内容采用 CSS 方法几乎可以让您完全控制内容的大小,因为它InfoWindow只是作为内容的容器。如果 CSS 规则生成正确大小的内容,则您的大小InfoWindow将是正确的。

于 2012-07-03T13:15:31.597 回答