In this post, I want to put forward the way of finding latitudes and longitudes of one's location.
We can use Geolocation API to achieve this.
We can use
navigator.geolocation.getCurrentPosition(method1ForPosition, method2ForError, optionsHere)
In the above method,
method1ForPosition has one method argument, the argument contains latitude and longitude of a given location.
method2ForPosition has one method argument, purpose of this method is to catch errors.
optionsHere contains the set of options we can set to the latitudes and longitudes we get in first method. However this is optional.
Below is full HTML + Javascript code used:
I got the below result from the above code.
The page asks you if you want to allow the page to track your location or not, click "Allow"
I masked the latitude and longitude, don't worry you will get the complete latitude and longitudes.
You can use Google Maps API for more detailed map.
Have fun learning. Don't hesitate to put in your suggestions.
We can use Geolocation API to achieve this.
We can use
navigator.geolocation.getCurrentPosition(method1ForPosition, method2ForError, optionsHere)
In the above method,
method1ForPosition has one method argument, the argument contains latitude and longitude of a given location.
method2ForPosition has one method argument, purpose of this method is to catch errors.
optionsHere contains the set of options we can set to the latitudes and longitudes we get in first method. However this is optional.
Below is full HTML + Javascript code used:
1: <html>
2: <body>
3: <script>
4: var options={enableHighAccuracy:true};
5: navigator.geolocation.getCurrentPosition(
6: //This function gets the co-ordinates, the latitudes and longitudes
7: function(varForCoordinates) {
8: //Variable coordinates contains latitude and longitude
9: var coordinates = varForCoordinates.coords;
10: //Creating an empty paragraph
11: var element1 = document.createElement("p");
12: //Assigning latitude and longitude to two variables
13: var latitude = coordinates.latitude;
14: var longitude = coordinates.longitude;
15: //Populating empty paragraph with text
16: element1.innerHTML="Latitude of your location is: "+latitude+"<br/>"+
17: "Longitude of your location is: "+longitude;
18: document.body.appendChild(element1);
19: //Creating an image and assiging google maps image to the source of the image.
20: var image = document.createElement("img");
21: image.src="https://maps.googleapis.com/maps/api/staticmap?center=" + latitude + "," + longitude + "&zoom=12&size=300x300&sensor=false";
22: document.body.appendChild(image);
23: },
24: //This function is used to trace any errors we might encounter while getting values
25: function(error) {
26: console.log("error code is: "+error.code+" and error description is as follows: "+error.message);
27: },
28: options
29: );
30: </script>
31: </body>
32: </html>
I got the below result from the above code.
The page asks you if you want to allow the page to track your location or not, click "Allow"
I masked the latitude and longitude, don't worry you will get the complete latitude and longitudes.
You can use Google Maps API for more detailed map.
Have fun learning. Don't hesitate to put in your suggestions.
No comments:
Post a Comment