Add HTML Link to Google Maps Circle Element

Question

I am sure there is a simple way to do this, but I can't seem to find it within the Google Maps online documentation. I have a map with several circles and the idea is that clicking on the circle will open up a new HTML page.

For each circle.....

Lat Long is defined:

var NZNorth=new google.maps.LatLng( -38.929764,176.009002);

Circle Variables:

var Circle1 = new google.maps.Circle({
center:NZNorth,
 radius:250000,
 strokeColor:"#FA0014",
 strokeOpacity:1,
 strokeWeight:1,
 fillColor:"#FA0014",
 fillOpacity:0.2
 });

Call the Circle:

Circle1.setMap(map); 

So to add a hyperlink onclick of the circle what do I need to do? I am not sure if I have to declare the link for each circle and then include an onclick function in each circle variable?

As always thanks for your help!

Answer 1

Incase anyone has the same problem, add the URL to your variable

var Circle1 = new google.maps.Circle({
center:NZNorth,
radius:250000,
strokeColor:"#FA0014",
strokeOpacity:1,
strokeWeight:1,
fillColor:"#FA0014",
fillOpacity:0.2,
URL:'http://www.bbc.co.uk'
});

Then add the listener!

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

 window.location = Circle1.URL; 

});

Answer 2

Circle throws an "click" event. So you must add a listener to it.