Firstly apologies if I ask stupid questions here. I've been doing Javascript for under 24 hours so some of the vagaries of the language are still getting to me.
Anyway .. I have a web page that is plotting some GPS coords. What I want is to display aq circle showing the GPS fix accuracy when you mouse over one of the way point markers. I have added a listener for 'mouseover' and 'mouseout' but the circle doesnt appear to be getting created. I've stepped through the code using chrome and the mouseover event is definitely getting called.
var map;
var Coords;
var Accurs;
var accurCircle;
function initialize()
{
Coords = [
];
var Times = [
'09:25:41 05/11/2010',
'09:25:46 05/11/2010'
];
Accurs = [
250.00,
250.00
];
var Path = new google.maps.Polyline(
{
path: Coords,
strokeColor: "#0000ff",
strokeOpacity: 1.0,
strokeWeight: 4
});
var myOptions =
{
zoom: 16,
center: Coords[Coords.length - 1],
mapTypeId: google.maps.MapTypeId.HYBRID
};
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
Path.setMap( map );
for ( i = 0; i < Coords.length; i++ )
{
var marker = new google.maps.Marker(
{
position: Coords[i],
title: 'waypoint ' + (i + 1) + ' of ' + Coords.length + ' at ' + Times[i],
map: map
});
google.maps.event.addListener( marker, 'mouseover', function(event) { addCircle(i) } );
google.maps.event.addListener( marker, 'mouseout', function(event) { killCircle(i) } );
}
}
function addCircle(i)
{
accurCircle = new google.maps.Circle(
{
center: Coords[i],
radius: Accurs[i],
fillColor: "#0000ff",
fillOpacity: 0.25,
strokeWeight: 1,
map: map
});
}
function killCircle(i)
{
delete accurCircle;
}
So can anyone tell me what I'm doing wrong? Btw I was also unsure of how to kill accurCircle I'm guessing delete isn';t hte right way (I'm a C++ programmer ;)).