Hello all, this is my first post as I have only recently started using OpenLayers. It is awesome to say the least. I'm currently using OpenLayers integrated with Cloudmade so I hope that this question is being posted in the appropriate place and to the appropriate group.<br>
<br>I'm attempting to use the new HTML javascript functions getCurrentPosition and watchPosition to constantly update a marker (and the center) of a map. These two functions are great, and I've successfully tied them into the setCenter function so that the center of the map follows your position when using a geolocation-aware browser. However, when I try to set a marker and then use the setLatLng function, I have no luck. Below is the code. It appears that setLatLng function breaks the rest, because whenever that line is there, the map does not re-center or re-zoom. If I comment it out, it works fine but of course the marker doesn't adjust to the new coords.<br>
<br><br>--<br>success = function(position){<br><br>var epsg4326 = new OpenLayers.Projection("EPSG:4326");<br>var epsg900913 = new OpenLayers.Projection("EPSG:900913");<br> var center = new OpenLayers.LonLat(position.coords.longitude, position.coords.latitude).transform(epsg4326, epsg900913);<br>
var zoom = parseInt(map.center.zoom);<br> OL.maps[<a href="http://map.id">map.id</a>].map.setCenter(center, zoom, false, false);<br>var markers = new OpenLayers.Layer.Markers("Markers");<br> OL.maps[<a href="http://map.id">map.id</a>].map.addLayer(markers);<br>
var marker = new OpenLayers.Marker(center);<br> markers.addMarker(marker);<br>}<br><br> fail = function(){<br> alert("Your browser does not support Geolocation");<br> var center = new OpenLayers.LonLat(map.center.lon, map.center.lat);<br>
var zoom = parseInt(map.center.zoom);<br> OL.maps[<a href="http://map.id">map.id</a>].map.setCenter(center, zoom, false, false);<br>}<br><br>updateLocation = function(position){ // Fires everytime your location change positions<br>
var epsg4326 = new OpenLayers.Projection("EPSG:4326");<br> var epsg900913 = new OpenLayers.Projection("EPSG:900913");<br> var newCenter = new OpenLayers.LonLat(position.coords.longitude, position.coords.latitude).transform(epsg4326, epsg900913);<br>
var zoom = parseInt(map.center.zoom);<br> marker.setLatLng(newCenter);<br> OL.maps[<a href="http://map.id">map.id</a>].map.setCenter(newCenter, 18);<br> };<br><br>
navigator.geolocation.getCurrentPosition(success, fail);<br><br>navigator.geolocation.watchPosition(updateLocation);<br><br>--<br><br>As you can see, there are three functions, then the two geolocation functions are called below them. This code is admittedly ugly and incomplete since it is being taken from a much larger file, but I believe all the things necessary to troubleshoot the 'marker.setLatLng(newCenter);' line are present.<br>
<br>I'm thinking that the problem may stem from the local variables inside each function: ie. inside of updateLocation() there is no marker defined, but I'm not really sure what to do about that (or even if that is accurate). My javascript is improving but still not up to snuff, so I'm probably (and hopefully) missing something very obvious here.<br>
<br>Thanks in advance for any help provided. You can see the live file at <a href="http://www.savannahtraveler.com/maps">www.savannahtraveler.com/maps</a><br>