HTML5-এ জিওলোকেশন কোঅর্ডিনেট কীভাবে ব্যবহার করবেন?

HTML5 Geolocation API এবং কোঅর্ডিনেট ব্যবহার

HTML5 Geolocation API আপনাকে আপনার অবস্থান প্রিয় ওয়েবসাইটের সাথে শেয়ার করতে দেয়। একটি জাভাস্ক্রিপ্ট আপনার অক্ষাংশ এবং দ্রাঘিমাংশ ধরতে পারে এবং ব্যাকএন্ড ওয়েব সার্ভারে পাঠাতে পারে এবং ফ্যান্সি লোকেশন-অয়ের জিনিসগুলো করতে পারে যেন লোকাল বিজনেস খুঁজে বের করা বা ম্যাপে আপনার অবস্থান দেখানো। জিওলোকেশন কোঅর্ডিনেট ডিভাইসের ভৌগোলিক অবস্থান নির্দেশ করে।

জিওলোকেশন মেথডগুলো getCurrentPosition() এবং watchPosition() কলব্যাক মেথড নির্দিষ্ট করে যা লোকেশন ইনফরমেশন রিট্রিভ করে। এই মেথডগুলো অ্যাসিনক্রোনাসলি একটি Position অবজেক্টের সাথে কল করা হয় যা সম্পূর্ণ লোকেশন ইনফরমেশন সংরক্ষণ করে।

Position অবজেক্ট ডিভাইসের বর্তমান ভৌগোলিক অবস্থান নির্দেশ করে। লোকেশনটি ভৌগোলিক কোঅর্ডিনেটের একটি সেট হিসেবে এক্সপ্রেস করা হয় সাথে হেডিং এবং স্পিডের ইনফরমেশনসহ।

Position অবজেক্টের প্রপার্টিগুলো:

নিচের কোডটি Position অবজেক্টের সাথে ল্যাটিটিউড এবং লองিটিউডের জন্য কোঅর্ডিনেট ব্যবহার করে:

Geolocation অবজেক্টের মেথডগুলো:

উদাহরণ

নিচের কোডটি চালিয়ে জিওলোকেশন নিয়ে কাজ করতে এবং HTML5-এ জিওলোকেশন কোঅর্ডিনেট ব্যবহার করতে শিখুন। এটি ডিভাইসের বর্তমান ভৌগোলিক অবস্থান সম্পর্কে পিরিয়ডিক আপডেট রিট্রিভ করে। লোকেশনটি ভৌগোলিক কোঅর্ডিনেটের একটি সেট হিসেবে এক্সপ্রেস করা হয় সাথে হেডিং এবং স্পিডের ইনফরমেশনসহ।

<!DOCTYPE HTML>
<html>
  <head>
    <script type="text/javascript">
      var watchID;
      var geoLoc;
      function showLocation(position) {
        var latitude = position.coords.latitude;
        var longitude = position.coords.longitude;
        alert("Latitude : " + latitude + " Longitude: " + longitude);
      }
      function errorHandler(err) {
        if(err.code == 1) {
          alert("Error: Access is denied!");
        } else if( err.code == 2) {
          alert("Error: Position is unavailable!");
        }
      }
      function getLocationUpdate(){
        if(navigator.geolocation){
          // timeout at 60000 milliseconds (60 seconds)
          var options = {timeout:60000};
          geoLoc = navigator.geolocation;
          watchID = geoLoc.watchPosition(showLocation, errorHandler, options);
        } else{
          alert("Sorry, browser does not support geolocation!");
        }
      }
    </script>
  </head>
  <body>
    <form>
      <input type="button" onclick="getLocationUpdate();" value="Watch Update"/>
    </form>
  </body>
</html>

গুরুত্বপূর্ণ দ্রষ্টব্য:

• HTTPS এনভায়রনমেন্টে কাজ করে (localhost-এর বাদে)
• ব্যবহারকারীর পারমিশন আবশ্যক
• options-এ enableHighAccuracy: true, timeout, maximumAge সেট করা যায়