Geolocation through Android's GPS Provider on a website?
- by Corey Ogburn
I'm trying to get the geolocation of the mobile device in a regular website, not a webview of an application or anything native like that. I'm getting a location, but it's highly inaccurate, the accuracy comes back as 3230 or some other outrageous number. I'm assuming that's in meters, either way it's not nearly accurate enough. By comparison, the same webpage on a laptop gets an accuracy of 30-40.
My first thought was that it was using the Network Provider instead of the GPS Provider, telling me where I am based on tower location and reach. A little research later I found enableHighAccuracy and set it true in the options that I pass. After including that, I still notice no difference.
Here's the test page's HTML/javascript:
<html>
<head>
<script type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script type="text/javascript">
function OnLoad() {
$("#Status").text("Init");
if (navigator.geolocation) {
$("#Status").text("Supports Geolocation");
navigator.geolocation.getCurrentPosition(HandleLocation, LocationError, { enableHighAccuracy: true });
$("#Status").text("Sent position request...");
} else {
$("#Status").text("Doesn't support geolocation");
}
}
function HandleLocation(position) {
$("#Status").text("Received response:");
$("#Position").text("(" + position.coords.latitude + ", " + position.coords.longitude + ") accuracy: " + position.coords.accuracy);
var loc = new Microsoft.Maps.Location(position.coords.latitude, position.coords.longitude);
GetMap(loc);
}
function LocationError(error) {
switch(error.code) {
case error.PERMISSION_DENIED:
alert("Location not provided");
break;
case error.POSITION_UNAVAILABLE:
alert("Current location not available");
break;
case error.TIMEOUT:
alert("Timeout");
break;
default:
alert("unknown error");
break;
}
}
function GetMap(loc) {
var map = new Microsoft.Maps.Map(document.getElementById("mapDiv"), {credentials: "Aj59meaCR1e7rNgkfQy7j08Pd3mzfP1r04hGesGmLe2a3ZwZ3iGecwPX2SNPWq5a", center: loc, mapTypeId: Microsoft.Maps.MapTypeId.road, zoom: 15});
}
</script>
</head>
<body onload="javascript:OnLoad()">
<div id="Status"></div>
<div id="Position"></div><br/>
<div id='mapDiv' style="position:relative; width:600px; height:400px;"></div>
</body>
</html>
I'm testing this on a rooted MyTouch 3G running Cyanogen 6.1 stable, Android 2.2 and GPS is enabled. In case rooting was a problem, I have also had various friends and coworkers try the webpage on their non-rooted 2.0+ Android devices. Each phone had various effects on the accuracy, but none were better than 1000, I attribute this to the different carriers. I have not (but eventually will) tested with iPhone or other location-aware cell phones.
