I am using Google Maps API v3
, and have several map markers that link to different pages. When onmouseover
the status bar is not displaying the url, however when the marker is clicked it does display the url loading text in the status bar.
It seems that my code is conflicting with the status bar in some way, or do you have to specify a property to show the status bar? Here is my code:
function initialize(mapInfo)
{
// object literal for map options
var myOptions =
{
center: new google.maps.LatLng(30, 3), // coordinates for center of map
zoom: 2, // smaller number --> zoom out
mapTypeId: google.maps.MapTypeId.HYBRID // ROADMAP, SATELLITE, TERRAIN, or HYBRID
};
// note: if the id has a dash in its' name, map instantiation doesn't work!
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
// MAP MARKERS instantiated here
for(var i = 0; i < mapInfo.length; i++)
{
var link = mapInfo[i].link;
var name = mapInfo[i].name;
var lat = mapInfo[i].lat;
var lng = mapInfo[i].lng;
// object literal for each map marker
var marker = new google.maps.Marker(
{
url: link,
title: name,
position: new google.maps.LatLng(lat, lng),
map: map
});
// setting the link to each map marker here
setLink(marker);
// setting each map marker here
marker.setMap(map);
}
} // end of function initialize()
function setLink(mapMarker)
{
// event listener for marker links added to each marker
google.maps.event.addListener(mapMarker, "click", function()
{
window.location.href = mapMarker.url; // obtaining the url from the object literal
});
}
...I am getting the object-literal mapInfo (passed into the function initialize) from Ajax, parsed with JSON--just to clarify the mapInfo properties.
********************************EDIT: **********************************
Here is a solution, simply putting the link in an infowindow
instead:
// object literal for each map marker
var marker = new google.maps.Marker(
{
//url: link,
title: name,
content: "<a href = " + link + ">" + name + "</a>",
position: new google.maps.LatLng(lat, lng),
map: map
});
setWindow(map, marker);
function setWindow(map, mapMarker)
{
// event listener for marker links added to each marker
google.maps.event.addListener(mapMarker, "click", function()
{
var infowindow = new google.maps.InfoWindow(
{
content: mapMarker.content
});
infowindow.open(map, mapMarker);
});
}