Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
Node is saved as draft in My Content >> Draft
  • Geolocation in HTML

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 55
    Comment on it

    Using HTML Geolocation

     

    HTML Geolocation is used to identify the position of any object based on its geographical parameters passed.

     

    You can use its functions to find the position of the object.

     

    It will check whether geolocation works on your browser or not.

     

    <script>
    var x = document.getElementById("demo");
    function getLocation() {
        if (navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(showPosition);
        } else {
            x.innerHTML = "Geolocation is not supported by this browser.";
        }
    }
    function showPosition(position) {
        x.innerHTML = "Latitude: " + position.coords.latitude +
        "<br>Longitude: " + position.coords.longitude;
    }
    </script>

     

    It will handle errors while finding location of any object.

     

    function showError(error) {
        switch(error.code) {
            case error.PERMISSION_DENIED:
                x.innerHTML = "User denied the request for Geolocation."
                break;
            case error.POSITION_UNAVAILABLE:
                x.innerHTML = "Location information is unavailable."
                break;
            case error.TIMEOUT:
                x.innerHTML = "The request to get user location timed out."
                break;
            case error.UNKNOWN_ERROR:
                x.innerHTML = "An unknown error occurred."
                break;
        }
    }

     

    It will display the result in map.

    function showPosition(position) {
        var latlon = position.coords.latitude + "," + position.coords.longitude;
    
        var img_url = "http://maps.googleapis.com/maps/api/staticmap?center=
        "+latlon+"&zoom=14&size=400x300&sensor=false";
    
        document.getElementById("mapholder").innerHTML = "<img src='"+img_url+"'>";
    }

     

    HTML tags

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: