除了标记,多边形,折线和其他几何形状外,我们还可以在地图上绘制信息窗口.本章介绍如何使用信息窗口.
信息窗口用于向地图添加任何类型的信息.例如,如果要提供有关地图上某个位置的信息,可以使用信息窗口.通常,信息窗口附加到标记.您可以通过实例化 google.maps.InfoWindow 类来附加信息窗口.它具有以下属性 :
内容 : 您可以使用此选项以字符串格式传递内容.
position : 您可以使用此选项选择信息窗口的位置.
maxWidth : 默认情况下,信息窗口的宽度将被拉伸,直到文本被包装.通过指定maxWidth,我们可以水平限制信息窗口的大小.
以下示例显示如何设置标记并在其上方指定信息窗口 :
<!DOCTYPE html> <html> <head> <script src = "https://maps.googleapis.com/maps/api/js"></script> <script> function loadMap() { var mapOptions = { center:new google.maps.LatLng(17.433053, 78.412172), zoom:5 } var map = new google.maps.Map(document.getElementById("sample"),mapOptions); var marker = new google.maps.Marker({ position: new google.maps.LatLng(17.433053, 78.412172), map: map, draggable:true, icon:'/scripts/img/logo-footer.png' }); marker.setMap(map); var infowindow = new google.maps.InfoWindow({ content:"388-A , Road no 22, Jubilee Hills, Hyderabad Telangana, INDIA-500033" }); infowindow.open(map,marker); } </script> </head> <body onload = "loadMap()"> <div id = "sample" style = "width:580px; height:400px;"></div> </body> </html>