google maps - open marker infowindow given the coordinates
I am using google maps api v3.
Using javascript, how can i open the infowin开发者_运维知识库dow of a marker given it's coordinates?
Here is the Jsfiddle that shows you how to do an "outside" of the map JavaScript interaction w/ the Markers. Yes, you do need to save the markers and it's appropriate InfoWindow within an array so you can access it. I created two random markers and use the coordinates from the array ships.
Here are the HTML and with two generic links where clicking link one would center to maker 1 and popup its infowindow and for marker 2 vise versa:
<div id='map_canvas'></div>
<a href='#' onClick="gotoPoint(1);">Click for marker 1</a><br/>
<a href='#' onClick="gotoPoint(2);">Click for marker 2</a>
Within createMarker i store the created maker along with its associate InfoWindow and push it onto the global scope's marker array. On hover the marker, it'll open its associate infowindow:
function createMarker(lat, lon, html) {
var newmarker = new google.maps.Marker({
position: new google.maps.LatLng(lat, lon),
map: map,
title: html
});
newmarker['infowindow'] = new google.maps.InfoWindow({
content: html
});
google.maps.event.addListener(newmarker, 'mouseover', function() {
this['infowindow'].open(map, this);
});
marker.push(newmarker);
}
Here in gotoPoint i simply ass in the marker number as a parameter. I basically set the center of the map to that of marker by using new google.maps.LatLng
and use the marker's lat and lng by calling marker[myPoint-1].position.lat();
and marker[myPoint-1].position.lng();
, and open its associate InfoWindow with marker[myPoint-1]['infowindow'].open(map, marker[myPoint-1]);
:
function gotoPoint(myPoint){
map.setCenter(new google.maps.LatLng(marker[myPoint-1].position.lat(), marker[myPoint-1].position.lng()));
marker[myPoint-1]['infowindow'].open(map, marker[myPoint-1]);
}
Let me know if you have any questions about this example.
精彩评论