HTML জিওলোকেশন (Geolocation): ব্যবহারকারীর অবস্থান জানা

HTML জিওলোকেশন একটি ব্যবহারকারীর রিয়েল-টাইম ভৌগোলিক অবস্থান পাওয়ার জন্য ব্যবহৃত হয়, শর্ত 그게 ব্যবহারকারী অনুমতি দেয়। এর বিভিন্ন কাজে ব্যবহার করা যায়। এটি ল্যাটিটিউড (latitude) এবং লองিটিউড (longitude) পাওয়ার জন্য JavaScript ব্যবহার করে।

দ্রষ্টব্য: Google Chrome 50-এর আগে জিওলোকেশন রিকোয়েস্ট অনুমোদিত হতো, কিন্তু Chrome 50-এর পর থেকে শুধু HTTPS-এর মাধ্যমে করা রিকোয়েস্ট অনুমোদিত হয় এবং HTTP-এর মাধ্যমে করা রিকোয়েস্ট উপেক্ষা করা হয়।

সিনট্যাক্স

সিনট্যাক্স নিচে দেওয়া হলো:

navigator.geolocation.getCurrentPosition()

এখানে, getCurrentPosition() দ্বারা রিটার্ন করা অবজেক্টের নিচের প্রোপার্টিগুলো থাকতে পারে:

উদাহরণ

HTML জিওলোকেশন কীভাবে এরর হ্যান্ডলিং প্রদান করে তার একটি উদাহরণ:

<!DOCTYPE html> <html> <head> <title>HTML Geolocation</title> <style>    * {       padding: 2px;       margin:5px;    }    form {       width:70%;       margin: 0 auto;       text-align: center;    }    input[type="button"] {       border-radius: 10px;    } </style> </head> <body> <form> <fieldset> <legend>HTML-Geolocation</legend> <input type="button" value="Update Location" onclick="updateLocation()"> <input type="button" value="Search" onclick="searchLoc()"> <div id="divDisplay">Current Location:</div> <div> <span id="latitude">Latitude: 42.9177901</span> <span id="longitude">Longitude: -75.8114698</span> </div> <script>    var latObj = document.getElementById("latitude");    var longObj = document.getElementById("longitude");    var divDisplay = document.getElementById("divDisplay");    function searchLoc(){       var lat = latObj.textContent.split(": ")[1];       var long = longObj.textContent.split(": ")[1];       var url = "https://www.google.com/maps/@"+lat+","+long+",8.58z";       browseWindow = window.open(url, "browseWindow", "width=400, height=200");    }    function updateLocation(){       browseWindow.close();       var user = navigator.geolocation;       if (user)          user.getCurrentPosition(updatePosition, errorHandler);       else          divDisplay.textContent = "Geolocation is not supported in this browser";    }    function updatePosition(position) {       divDisplay.innerHTML = 'Location Updated<br>Current Location:';       latObj.textContent = 'Latitude: '+position.coords.latitude;       longObj.textContent = 'Longitude: '+position.coords.longitude;    }    function errorHandler(error) {       switch(error.code) {          case error.PERMISSION_DENIED:             divDisplay.textContent = "You denied the request to get Geolocation"             break;          case error.POSITION_UNAVAILABLE:             divDisplay.textContent = "Your location information is unavailable"             break;          case error.TIMEOUT:             divDisplay.textContent = "The request to get your location timed out"             break;          case error.UNKNOWN_ERROR:             divDisplay.textContent = "Unknown error occurred"             break;       }    } </script> </body> </html>

১) কোনো বাটনে ক্লিক করার আগে:

২) 'Search' বাটনে ক্লিক করার পর:

৩) 'Update Location' বাটনে ক্লিক করার পর:

৪) 'Search' বাটনে ক্লিক করার পর:

৫) 'Update Location' বাটনে ক্লিক করার পর এবং ব্যবহারকারী লোকেশন অ্যাক্সেস অনুমতি না দিলে: