Google maps-api v3 InfoWindow automatically open on page load

问题:

I am working on a project where I am using the Google Maps api-v3 , On the map there will be a few place markers containing information that I am storing in an InfoWindow.

I am wondering is there anyway that you can set an InfoWindow to automatically open on the page load (i.e automatically open without user interaction).

Searching online all I can seem to find is that it needs to be tied to an event listener but all the events the InfoWindow object seems to have are mouse events.

Does anyone know of a workaround of sorts ?

回答1:

Not sure I fully understand your question but this works for me with a hard-coded LatLng:

var infoWindow = null; function initialize()  {     infoWindow = new google.maps.InfoWindow();     var windowLatLng = new google.maps.LatLng(43.25,-68.03);     infoWindow.setOptions({         content: "
This is the html content.
",         position: windowLatLng,     });     infoWindow.open(map);  } // end initialize  google.setOnLoadCallback(initialize); 

回答2:

I am very late for this question but I wanted to share something.I also searched for its solution and even did not get working from the above solution. Then I tried myself and got my own solution (I am not expert and my idea may not be good but working fine for me). we generally do like

var infowindow = new google.maps.InfoWindow(); google.maps.event.addListener(marker, 'click', (function(marker) { return function() {     infowindow.setContent('some content here');       infowindow.open(map, marker);     } })(marker)); 

replace the above lines with:

var infowindow = new google.maps.InfoWindow(); infowindow.setContent('some content here'); infowindow.open(map, marker); 

dont wait for the click event of marker simply set the content and open it (you must define the map and marker and infowindow points to your marker).

回答3:

Just take the infowindow.open(map,marker); out of the google.maps.event.addListener. It should look like this:

      var marker = new google.maps.Marker({       position: myLatlng1,       map: map,       title: 'Uluru (Ayers Rock)'    });    infowindow.open(map,marker);    google.maps.event.addListener(marker, 'click', function() {   });    

回答4:

Here is my code that loads info window with map and also with mouse over.

map.setCenter(results[0].geometry.location); var marker = new google.maps.Marker({     map: map,     icon: "/images/map-marker.png",     draggable: true,     position: results[0].geometry.location  }); var infowindow = new google.maps.InfoWindow({     content: "Use pin to point your exact locality" }); google.maps.event.addListener(marker, 'mouseover', function () {     infowindow.open(map, marker); }); infowindow.open(map, marker); 

回答5:

function initMap() {     var cairo = {lat:18.519331, lng: 73.849421};     var map = new google.maps.Map(document.getElementById('map'), {         scaleControl: true,         center: cairo,         zoom: 15,     });      var infowindow = new google.maps.InfoWindow;     infowindow.setContent('adddress');      var marker = new google.maps.Marker({map: map, position: cairo});     infowindow.open(map, marker);     infoWindow.open(map);  }

文章来源: Google maps-api v3 InfoWindow automatically open on page load