We Recommend

Pro JavaScript Techniques Pro JavaScript Techniques
Pro JavaScript Techniques is the ultimate JavaScript book for the modern web developer. It provides everything you need to know about modern JavaScript, and shows what JavaScript can do for your web sites. This book doesn't waste any time looking at things you already know, like basic syntax and structures.


Posted By

adamdecaf on 06/26/09


Tagged

javascript location geo geolocation


Versions (?)


Who likes this?

1 person has marked this snippet as a favorite

vali29


JavaScript GeoLocation


Published in: JavaScript 


This will only work in FF 3.5 and web-kit browsers after (06/26/2009)

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title></title>
  5. <script src="geoLocation.js"></script>
  6. <style>
  7. div#location {
  8. border: 1px solid #000000;
  9. height: 300px;
  10. margin-left: 25%;
  11. margin-top: 5%;
  12. padding: 10px 5px 10px 5px;
  13. width: 50%;
  14. }
  15. </style>
  16. </head>
  17. <body>
  18.  
  19. <div id="location">
  20.  
  21. </div>
  22.  
  23. <script>
  24. /**
  25.  * Sample GeoLocation Script
  26.  * Adam Shannon
  27.  * 06/26/2009
  28.  */
  29.  
  30. function getLocation() {
  31. // First we must test to see if GeoLocation is even supported.
  32. if (navigator.geolocation) {
  33.  
  34. // Now wee can start the service.
  35. // navigator.geolocation.startup();
  36.  
  37. // Check to see if the API is ready.
  38. // if (!navigator.geolocation.isReady()) {
  39. // alert("Whoops, your GeoLocation API is not currently ready");
  40. // }
  41.  
  42. // Make the call
  43. // navigator.geolocation.getCurrentPosition(success, fail, options);
  44. navigator.geolocation.getCurrentPosition(function(position) {
  45. fillDiv(
  46. position.coords.latitude,
  47. position.coords.longitude,
  48. position.coords.altitude,
  49. position.coords.accuracy,
  50. position.coords.altitudeAccuracy,
  51. position.coords.heading,
  52. position.coords.speed
  53. );
  54. });
  55.  
  56. // Shut it down
  57. // navigator.geolocation.shutdown();
  58.  
  59. } else {
  60. alert("Whoops, it seems like your browser doesn't support GeoLocation.");
  61.  
  62. }
  63.  
  64. return;
  65. }
  66.  
  67. function fillDiv(latitude, longitude, altitude, accuracy, altitudeAccuracy, heading, speed) {
  68. // Go...
  69. // alert(latitude);
  70. // alert(longitude);
  71.  
  72. var e = document.getElementById("location");
  73. e.innerHTML = "";
  74. e.innerHTML += "Latitude: " + latitude + "<br />";
  75. e.innerHTML += "Longitude: " + longitude + "<br />";;
  76. e.innerHTML += "Altitude: " + altitude + "<br />";;
  77. e.innerHTML += "Accuracy: " + accuracy + "<br />";;
  78. e.innerHTML += "altitudeAccuracy: " + altitudeAccuracy + "<br />";;
  79. e.innerHTML += "Heading: " + heading + "<br />";;
  80. e.innerHTML += "Speed: " + speed;
  81. return;
  82. }
  83.  
  84. // Now call
  85. getLocation();
  86. </script>
  87. </body>
  88. </html>

Report this snippet 

You need to login to post a comment.