google-maps-api-3 - style - personalizar infowindow google maps v3

Google maps-api v3 InfoWindow se abre automáticamente en la carga de la página

Question

Estoy trabajando en un proyecto en el que estoy usando Google Maps api-v3. En el mapa habrá algunos marcadores de lugar que contienen información que estoy almacenando en InfoWindow.

Me pregunto, de todos modos, si puede configurar una Ventana de información para que se abra automáticamente en la carga de la página (es decir, se abra automáticamente sin interacción del usuario).

Al buscar en línea, todo lo que puedo encontrar es que debe estar vinculado a un detector de eventos, pero todos los eventos que parece tener el objeto InfoWindow son eventos del mouse.

¿Alguien sabe de algún tipo de solución?

Answer 1

Aquí está mi código que carga la ventana de información con el mapa y también con el mouse sobre.

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);

Answer 2

Llegué muy tarde a esta pregunta, pero quería compartir algo. También busqué su solución e incluso no funcionó con la solución anterior. Luego me probé y obtuve mi propia solución (no soy experto y mi idea puede no ser buena, pero funciona bien para mí). generalmente nos gusta

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));

reemplace las líneas anteriores con:

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

no espere al evento click del marcador simplemente configure el contenido y ábralo (debe definir el mapa y el marcador y los puntos de infowindow para su marcador).

Answer 3

No estoy seguro de entender completamente su pregunta, pero esto funciona para mí con un latLng codificado:

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

Answer 4

Simplemente tome el infowindow.open (mapa, marcador); fuera de google.maps.event.addListener. Debe tener un aspecto como este:

 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() {
});

Answer 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(''<b>adddress</b>'');
var marker = new google.maps.Marker({map: map, position: cairo});
infowindow.open(map, marker);
infoWindow.open(map);
}

<script async defer
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCrCByzXY6y5KMSOi9AuqWVf4VYZPyJ5SE&language=hi&region=EG&callback=initMap">
</script>
<div id="map"></div>