如何将infowindow添加到多边形

时间:2014-04-28 06:26:55

标签: javascript html google-maps google-maps-api-3

我写的是代码,主要是我只是从google api示例中复制它,不知道我哪里出错了,我确定错误来自" google.maps.event.addListener"功能,但不知道如何解决它,任何人都可以帮助我吗?

<!DOCTYPE html>
<html>
<head>
<script
src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDY0kkJiTPVd2U7aTOAwhc9ySH6oHxOIYM&sensor=false">
</script>

<script>
var infowindow = new google.maps.InfoWindow(
 { 
content:"abc"
 });

var x=new google.maps.LatLng(52.395715,4.888916);
var stavanger=new google.maps.LatLng(58.983991,5.734863);
var amsterdam=new google.maps.LatLng(52.395715,4.888916);
var london=new google.maps.LatLng(51.508742,-0.120850);

function initialize()
{
var mapProp = {
  center:x,
  zoom:4,
  mapTypeId: google.maps.MapTypeId.ROADMAP
 };

var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);

var myTrip=[stavanger,amsterdam,london,stavanger];
var flightPath=new google.maps.Polygon({
path:myTrip,
strokeColor:"#0000FF",
strokeOpacity:0.8,
strokeWeight:2,
fillColor:"#0000FF",
fillOpacity:0.4
});

flightPath.setMap(map);
}
google.maps.event.addListener(flightPath,'click', function() {


      infowindow.setPosition(stavanger);
      infowindow.open(map,flightPath);
    }); 

  google.maps.event.addDomListener(window, 'load', initialize);
 </script>
 </head>

<body>
<div id="googleMap" style="width:500px;height:380px;"></div>
</body>
</html>

2 个答案:

答案 0 :(得分:1)

通过获取多边形路径中第一个点的坐标并将其用于信息窗来显示信息窗

google.maps.event.addListener(flightPath,'click', function() {

   infowindow.setPosition(this.getPath().getAt(0));
   infowindow.open(map);
 }); 

答案 1 :(得分:0)

google.maps.event.addListener(flightPath,'click', function() {
    var aar=this.getPaths();

    infowindow.setPosition(arr.getAt(2));
    infowindow.open(map,flightPath);
 });