10、谷歌地图信息窗口的使用与优化

谷歌地图信息窗口的使用与优化

1. 信息窗口基础

信息窗口（InfoWindow）是一种与标记（Marker）分离但属于同一覆盖物类别的对象。可以使用 addListener() 方法将信息窗口附加到标记上，当标记上发生特定事件（如点击事件）时，关联的信息窗口气球将显示出来。创建信息窗口的构造函数是 InfoWindow ，它接受一个对象字面量作为参数，其中 content 属性用于承载气球的内容。

以下是创建信息窗口并将其附加到标记的完整代码示例：

function initialize() {
  var coordinates = new google.maps.LatLng(53.344104, - 6.267494);

  var myOptions = {
    center: coordinates,
    zoom: 14,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

  //Create a new marker
  var sampleMarker = new google.maps.Marker({
    position: coordinates
  });
  sampleMarker.setMap(map);

  //Create the content to be