Advanced Search

JavaScript GeoLocation

/ Published in: JavaScript
Save to your folder(s)
This will only work in FF 3.5 and web-kit browsers after (06/26/2009)

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  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


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.