Question

there are the code i written, mostly i just copy it from the google api example, dont know where i get wrong,i am sure the error is from the "google.maps.event.addListener" function, but no idea how to fix it, can any one help me that?

<!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>
Was it helpful?

Solution

Display an infowindow by getting the coordinate of the first point in the path of the polygon and using it for the infowindow

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

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

OTHER TIPS

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

    infowindow.setPosition(arr.getAt(2));
    infowindow.open(map,flightPath);
 }); 
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top