উচ্চতা সংক্রান্ত পরিষেবা

এক নজরে

এলিভেশন পরিষেবা পৃথিবীর পৃষ্ঠের লোকেশনের জন্য এলিভেশন ডেটা প্রদান করে, যার মধ্যে সমুদ্রের তলদেশের গভীরতার লোকেশনও (যা নেগেটিভ ভ্যালু দেখায়) অন্তর্ভুক্ত। আপনার অনুরোধ করা সুনির্দিষ্ট লোকেশনে Google-এর কাছে সঠিক উচ্চতার পরিমাপ না থাকলে, পরিষেবাটি ইন্টারপোলেট করবে এবং চারটি নিকটতম লোকেশন ব্যবহার করে একটি গড় মান ফেরত দেবে।

ElevationService অবজেক্ট আপনাকে উচ্চতা সংক্রান্ত ডেটার জন্য পৃথিবীর লোকেশন কোয়েরি করার একটি সহজ ইন্টারফেস প্রদান করে। এছাড়াও, আপনি পাথ বরাবর স্যাম্পেল করা উচ্চতা ডেটার জন্য অনুরোধ করতে পারেন, যা আপনাকে রুট বরাবর সমদূরবর্তী উচ্চতার পরিবর্তন গণনা করতে দেয়। ElevationService অবজেক্ট Google Maps API Elevation Service-এর সাথে যোগাযোগ করে যা এলিভেশন সংক্রান্ত অনুরোধ গ্রহণ করে এবং এলিভেশন ডেটা ফেরত পাঠায়।

Elevation পরিষেবার মাধ্যমে আপনি হাইকিং ও বাইকিং অ্যাপ্লিকেশন, মোবাইল পজিশনিং অ্যাপ্লিকেশন অথবা কম রেজোলিউশন সার্ভেয়িং অ্যাপ্লিকেশন ডেভেলপ করতে পারবেন।

শুরু করা

Maps JavaScript API-তে Elevation পরিষেবা ব্যবহার করার আগে, প্রথমে নিশ্চিত করুন যে Elevation API, Google Cloud কনসোলে চালু করা আছে, একই প্রোজেক্টে যা আপনি Maps JavaScript API-এর জন্য সেট-আপ করেছেন।

আপনার চালু করা API-এর তালিকা দেখতে:

  1. Google Cloud Console-এ যান।
  2. প্রোজেক্ট বেছে নিন বোতামে ক্লিক করুন, তারপর Maps JavaScript API-এর জন্য সেট-আপ করা একই প্রোজেক্ট বেছে নিয়ে খুলুন বিকল্পে ক্লিক করুন।
  3. ড্যাশবোর্ড-এ API-এর তালিকা থেকে Elevation API খুঁজুন।
  4. তালিকায় API দেখতে পেলে, আপনি একদম রেডি। API তালিকাভুক্ত না থাকলে, এটি চালু করুন:
    1. পৃষ্ঠার সবচেয়ে উপরে, লাইব্রেরি ট্যাব দেখতে API চালু করুন বিকল্প বেছে নিন। অথবা, বাঁদিকের মেনু থেকে, লাইব্রেরি বেছে নিন।
    2. Elevation API সার্চ করে ফলাফলের তালিকা থেকে এটি বেছে নিন।
    3. চালু করুন বিকল্প বেছে নিন। প্রসেস সম্পূর্ণ হলে, Elevation API, ড্যাশবোর্ডে API-এর তালিকায় দেখা যাবে।

দাম ও নীতি

দাম

JavaScript Elevation পরিষেবার দাম ও ব্যবহার সংক্রান্ত নীতি সম্পর্কে জানতে, Elevation API-এর জন্য ব্যবহার ও বিলিং দেখুন।

নীতি

Elevation পরিষেবা ব্যবহার করার সময় Elevation API-এর জন্য বর্ণিত নীতি মেনে চলতে হবে।

উচ্চতা সংক্রান্ত অনুরোধ

Elevation পরিষেবা অ্যাক্সেস করা অ্যাসিঙ্ক্রোনাস, কারণ Google Maps API-কে একটি এক্সটার্নাল সার্ভারে কল করতে হয়। সেই কারণে, অনুরোধ সম্পূর্ণ হওয়ার পরে কার্যকর করার জন্য আপনাকে একটি কলব্যাক পদ্ধতি পাস করতে হবে। এই কলব্যাক পদ্ধতি ফলাফল প্রসেস করবে। মনে রাখবেন যে Elevation পরিষেবা একটি স্ট্যাটাস কোড (ElevationStatus) এবং আলাদা আলাদা ElevationResult অবজেক্টের একটি অ্যারে রিটার্ন করে।

ElevationService দুই ধরনের অনুরোধ ম্যানেজ করে:

  • getElevationForLocations() পদ্ধতি ব্যবহার করে আলাদা, স্বতন্ত্র লোকেশনের জন্য অনুরোধ, যা LocationElevationRequest অবজেক্ট ব্যবহার করে এক বা একাধিক লোকেশনের তালিকা পাস করে।
  • getElevationAlongPath() পদ্ধতি ব্যবহার করে কোনও পাথ বরাবর কানেক্ট করা পয়েন্টের সিরিজের উচ্চতা সংক্রান্ত অনুরোধ, যা PathElevationRequest অবজেক্টের মধ্যে পাথ ভার্টিসেসের অর্ডার করা সেট পাস করে। পাথ বরাবর উচ্চতা সংক্রান্ত ডেটার অনুরোধ করার সময়, আপনাকে একটি প্যারামিটারও পাস করতে হবে যা নির্দেশ করে আপনি সেই পাথ বরাবর কতগুলি স্যাম্পেল নিতে চান।

এছাড়াও, এই প্রতিটি পদ্ধতিকে অবশ্যই একটি কলব্যাক পদ্ধতি পাস করতে হবে যাতে ফেরত আসা ElevationResult এবং ElevationStatus অবজেক্ট ম্যানেজ করা যায়।

লোকেশন এলিভেশন সংক্রান্ত অনুরোধ

LocationElevationRequest অবজেক্ট লিটারাল নিম্নলিখিত ফিল্ড থাকে:

{
  locations[]: LatLng
}

locations (প্রয়োজনীয়) পৃথিবীর সেই লোকেশন(গুলি) নির্দিষ্ট করে যেখান থেকে এলিভেশন ডেটা পাওয়া যাবে। এই প্যারামিটার LatLng-এর অ্যারে নেয়।

আপনি পরিষেবার কোটা অতিক্রম না করা পর্যন্ত, অ্যারের মধ্যে যেকোনও সংখ্যক একাধিক কোঅর্ডিনেট পাস করতে পারেন। মনে রাখবেন যে একাধিক কোঅর্ডিনেট পাস করার সময়, ফেরত পাঠানো যেকোনও ডেটার অ্যাকুরেসি, একটি কোঅর্ডিনেটের জন্য ডেটার অনুরোধ করার তুলনায় কম রেজোলিউশনের হতে পারে।

স্যাম্পেল করা পাথ এলিভেশন সংক্রান্ত অনুরোধ

একটি PathElevationRequest অবজেক্ট লিটারাল নিম্নলিখিত ফিল্ডগুলি ধারণ করে:

{
  path[]: LatLng,
  samples: Number
}

এইসব ফিল্ডের ব্যাপারে নিচে ব্যাখ্যা করা হয়েছে:

  • path (প্রয়োজনীয়) পৃথিবীর উপর একটি পাথ নির্ধারণ করে যার জন্য এলিভেশন ডেটা রিটার্ন করতে হবে। path প্যারামিটার দুই বা তার বেশি LatLng অবজেক্টের অ্যারে ব্যবহার করে দুই বা তার বেশি {অক্ষাংশ,দ্রাঘিমাংশ} অর্ডার করা পেয়ারের সেটকে সংজ্ঞায়িত করে।
  • samples (প্রয়োজনীয়) একটি পথের সাথে স্যাম্পেল পয়েন্টের সংখ্যা নির্দিষ্ট করে যার জন্য উচ্চতা ডেটা ফেরত দিতে হবে। samples প্যারামিটারটি প্রদত্ত path-কে পাথ বরাবর সমদূরবর্তী পয়েন্টের একটি ক্রমিক সেটে ভাগ করে।

পজিশনাল অনুরোধের মতো, path প্যারামিটার অক্ষাংশ ও দ্রাঘিমাংশের মানের একটি সেট নির্দিষ্ট করে। তবে, পজিশনাল অনুরোধের মতো নয়, path ভার্টিসেসের একটি অর্ডার করা সেট নির্দিষ্ট করে। ভার্টিসে এলিভেশন ডেটা দেখানোর পরিবর্তে, পাথ অনুরোধ পাথের দৈর্ঘ্য বরাবর স্যাম্পেল করা হয়, যেখানে প্রতিটি স্যাম্পেল একে অপরের থেকে সমদূরত্বে (এন্ডপয়েন্ট সহ) থাকে।

উচ্চতা সংক্রান্ত উত্তর

প্রতিটি সঠিক অনুরোধের জন্য, Elevation পরিষেবা নির্দিষ্ট করা কলব্যাকে ElevationStatus অবজেক্টের সাথে ElevationResult অবজেক্টের একটি সেট ফিরিয়ে দেবে।

উচ্চতা সংক্রান্ত স্ট্যাটাস

প্রতিটি এলিভেশন অনুরোধ তার কলব্যাক ফাংশনের মধ্যে একটি ElevationStatus কোড ফেরত দেয়। এই status কোডে নিম্নলিখিত মানগুলির মধ্যে যেকোনও একটি থাকবে:

  • OK যা পরিষেবার অনুরোধ সফল হয়েছে বলে ইঙ্গিত করে
  • INVALID_REQUEST থেকে বোঝা যাচ্ছে যে পরিষেবার অনুরোধ নিয়ম মেনে পাঠানো হয়নি
  • OVER_QUERY_LIMIT ইঙ্গিত করছে যে অনুরোধকারী কোটা অতিক্রম করেছে
  • REQUEST_DENIED ইঙ্গিত করছে যে পরিষেবাটি অনুরোধটি সম্পূর্ণ করেনি, সম্ভবত একটি ভুল প্যারামিটারের কারণে
  • UNKNOWN_ERROR অজানা সমস্যার ইঙ্গিত দিচ্ছে

OK-এর জন্য এই স্ট্যাটাস কোড পরীক্ষা করে আপনার কলব্যাক সফল হয়েছে কিনা তা চেক করা উচিত।

উচ্চতা সংক্রান্ত ফলাফল

সফল হলে, আপনার কলব্যাক ফাংশনের results আর্গুমেন্টে ElevationResult অবজেক্টের একটি সেট থাকবে। এই অবজেক্টে নিম্নলিখিত এলিমেন্ট থাকে:

  • যে অবস্থানের জন্য উচ্চতা সংক্রান্ত ডেটা গণনা করা হচ্ছে, সেই অবস্থানের location এলিমেন্ট (যার মধ্যে LatLng অবজেক্ট রয়েছে)। মনে রাখবেন যে পাথ সংক্রান্ত অনুরোধের জন্য, location এলিমেন্টের সেটে পাথ বরাবর স্যাম্পেল করা পয়েন্ট থাকবে।
  • elevation এলিমেন্ট যা মিটারে লোকেশনের উচ্চতা নির্দেশ করে।
  • একটি resolution মান, যা ডেটা পয়েন্টের মধ্যে সর্বাধিক দূরত্ব নির্দেশ করে যেখান থেকে উচ্চতা ইন্টারপোলেট করা হয়েছে, মিটারে। রেজোলিউশন জানা না থাকলে এই প্রপার্টি পাওয়া যাবে না। মনে রাখবেন যে একাধিক পয়েন্ট পাস করা হলে উচ্চতা সংক্রান্ত ডেটা আরও অস্পষ্ট (আরও বেশি resolution ভ্যালু) হয়ে যায়। কোনও পয়েন্টের জন্য সবচেয়ে সঠিক উচ্চতার ভ্যালু পেতে, এটি স্বাধীনভাবে কোয়েরি করা উচিত।

উচ্চতার উদাহরণ

নিম্নলিখিত কোডটি LocationElevationRequest অবজেক্ট ব্যবহার করে ম্যাপে ক্লিককে উচ্চতা অনুরোধে অনুবাদ করে:

TypeScript

async function init(): Promise<void> {
    const [{ InfoWindow }, { ElevationService }] = await Promise.all([
        google.maps.importLibrary('maps'),
        google.maps.importLibrary('elevation'),
    ]);

    const mapElement = document.querySelector('gmp-map')!;
    const innerMap = mapElement.innerMap;

    const elevator = new ElevationService();
    const infowindow = new InfoWindow();

    infowindow.open(innerMap);

    // Add a listener for the click event. Display the elevation for the LatLng of
    // the click inside the infowindow.
    innerMap.addListener('click', (event: google.maps.MapMouseEvent) => {
        displayLocationElevation(event.latLng!, elevator, infowindow, innerMap);
    });
}

function displayLocationElevation(
    location: google.maps.LatLng,
    elevator: google.maps.ElevationService,
    infowindow: google.maps.InfoWindow,
    map: google.maps.Map
) {
    // Format numeric values to two decimal places
    const formatter = new Intl.NumberFormat(undefined, {
        maximumFractionDigits: 2,
    });

    // Initiate the location request
    elevator
        .getElevationForLocations({
            locations: [location],
        })
        .then(({ results }) => {
            if (results[0]) {
                const { elevation, location: resultLocation } = results[0];
                infowindow.setPosition(resultLocation);
                infowindow.setContent(
                    `The elevation at ${String(resultLocation)} <br>is ${formatter.format(elevation)} meters.`
                );
            } else {
                infowindow.setPosition(location);
                infowindow.setContent('No results found');
            }

            infowindow.open(map);
        })
        .catch((e: unknown) => {
            infowindow.setContent(
                `Elevation service failed due to: ${String(e)}`
            );
        });
}

void init();

জাভাস্ক্রিপ্ট

async function init() {
    const [{ InfoWindow }, { ElevationService }] = await Promise.all([
        google.maps.importLibrary('maps'),
        google.maps.importLibrary('elevation'),
    ]);

    const mapElement = document.querySelector('gmp-map');
    const innerMap = mapElement.innerMap;

    const elevator = new ElevationService();
    const infowindow = new InfoWindow();

    infowindow.open(innerMap);

    // Add a listener for the click event. Display the elevation for the LatLng of
    // the click inside the infowindow.
    innerMap.addListener('click', (event) => {
        displayLocationElevation(event.latLng, elevator, infowindow, innerMap);
    });
}

function displayLocationElevation(location, elevator, infowindow, map) {
    // Format numeric values to two decimal places
    const formatter = new Intl.NumberFormat(undefined, {
        maximumFractionDigits: 2,
    });

    // Initiate the location request
    elevator
        .getElevationForLocations({
            locations: [location],
        })
        .then(({ results }) => {
            if (results[0]) {
                const { elevation, location: resultLocation } = results[0];
                infowindow.setPosition(resultLocation);
                infowindow.setContent(
                    `The elevation at ${String(resultLocation)} <br>is ${formatter.format(elevation)} meters.`
                );
            } else {
                infowindow.setPosition(location);
                infowindow.setContent('No results found');
            }

            infowindow.open(map);
        })
        .catch((e) => {
            infowindow.setContent(
                `Elevation service failed due to: ${String(e)}`
            );
        });
}

void init();
উদাহরণ দেখুন

নিম্নলিখিত উদাহরণটি স্থানাঙ্কের সেট থেকে একটি পলিলাইন তৈরি করে এবং Google Visualization API ব্যবহার করে সেই পাথ বরাবর উচ্চতা সংক্রান্ত ডেটা দেখায়। (আপনাকে Google Common Loader ব্যবহার করে এই API লোড করতে হবে।) এলিভেশন অনুরোধ PathElevationRequest ব্যবহার করে তৈরি করা হয়:

TypeScript

// Load the Visualization API and the columnchart package.
// @ts-ignore TODO update to newest visualization library
google.load("visualization", "1", { packages: ["columnchart"] });

function initMap(): void {
  // The following path marks a path from Mt. Whitney, the highest point in the
  // continental United States to Badwater, Death Valley, the lowest point.
  const path = [
    { lat: 36.579, lng: -118.292 }, // Mt. Whitney
    { lat: 36.606, lng: -118.0638 }, // Lone Pine
    { lat: 36.433, lng: -117.951 }, // Owens Lake
    { lat: 36.588, lng: -116.943 }, // Beatty Junction
    { lat: 36.34, lng: -117.468 }, // Panama Mint Springs
    { lat: 36.24, lng: -116.832 },
  ]; // Badwater, Death Valley

  const map = new google.maps.Map(
    document.getElementById("map") as HTMLElement,
    {
      zoom: 8,
      center: path[1],
      mapTypeId: "terrain",
    }
  );

  // Create an ElevationService.
  const elevator = new google.maps.ElevationService();

  // Draw the path, using the Visualization API and the Elevation service.
  displayPathElevation(path, elevator, map);
}

function displayPathElevation(
  path: google.maps.LatLngLiteral[],
  elevator: google.maps.ElevationService,
  map: google.maps.Map
) {
  // Display a polyline of the elevation path.
  new google.maps.Polyline({
    path: path,
    strokeColor: "#0000CC",
    strokeOpacity: 0.4,
    map: map,
  });

  // Create a PathElevationRequest object using this array.
  // Ask for 256 samples along that path.
  // Initiate the path request.
  elevator
    .getElevationAlongPath({
      path: path,
      samples: 256,
    })
    .then(plotElevation)
    .catch((e) => {
      const chartDiv = document.getElementById(
        "elevation_chart"
      ) as HTMLElement;

      // Show the error code inside the chartDiv.
      chartDiv.innerHTML = "Cannot show elevation: request failed because " + e;
    });
}

// Takes an array of ElevationResult objects, draws the path on the map
// and plots the elevation profile on a Visualization API ColumnChart.
function plotElevation({ results }: google.maps.PathElevationResponse) {
  const chartDiv = document.getElementById("elevation_chart") as HTMLElement;

  // Create a new chart in the elevation_chart DIV.
  const chart = new google.visualization.ColumnChart(chartDiv);

  // Extract the data from which to populate the chart.
  // Because the samples are equidistant, the 'Sample'
  // column here does double duty as distance along the
  // X axis.
  const data = new google.visualization.DataTable();

  data.addColumn("string", "Sample");
  data.addColumn("number", "Elevation");

  for (let i = 0; i < results.length; i++) {
    data.addRow(["", results[i].elevation]);
  }

  // Draw the chart using the data within its DIV.
  chart.draw(data, {
    height: 150,
    legend: "none",
    // @ts-ignore TODO update to newest visualization library
    titleY: "Elevation (m)",
  });
}

declare global {
  interface Window {
    initMap: () => void;
  }
}
window.initMap = initMap;

জাভাস্ক্রিপ্ট

// Load the Visualization API and the columnchart package.
// @ts-ignore TODO update to newest visualization library
google.load("visualization", "1", { packages: ["columnchart"] });

function initMap() {
  // The following path marks a path from Mt. Whitney, the highest point in the
  // continental United States to Badwater, Death Valley, the lowest point.
  const path = [
    { lat: 36.579, lng: -118.292 }, // Mt. Whitney
    { lat: 36.606, lng: -118.0638 }, // Lone Pine
    { lat: 36.433, lng: -117.951 }, // Owens Lake
    { lat: 36.588, lng: -116.943 }, // Beatty Junction
    { lat: 36.34, lng: -117.468 }, // Panama Mint Springs
    { lat: 36.24, lng: -116.832 },
  ]; // Badwater, Death Valley
  const map = new google.maps.Map(document.getElementById("map"), {
    zoom: 8,
    center: path[1],
    mapTypeId: "terrain",
  });
  // Create an ElevationService.
  const elevator = new google.maps.ElevationService();

  // Draw the path, using the Visualization API and the Elevation service.
  displayPathElevation(path, elevator, map);
}

function displayPathElevation(path, elevator, map) {
  // Display a polyline of the elevation path.
  new google.maps.Polyline({
    path: path,
    strokeColor: "#0000CC",
    strokeOpacity: 0.4,
    map: map,
  });
  // Create a PathElevationRequest object using this array.
  // Ask for 256 samples along that path.
  // Initiate the path request.
  elevator
    .getElevationAlongPath({
      path: path,
      samples: 256,
    })
    .then(plotElevation)
    .catch((e) => {
      const chartDiv = document.getElementById("elevation_chart");

      // Show the error code inside the chartDiv.
      chartDiv.innerHTML = "Cannot show elevation: request failed because " + e;
    });
}

// Takes an array of ElevationResult objects, draws the path on the map
// and plots the elevation profile on a Visualization API ColumnChart.
function plotElevation({ results }) {
  const chartDiv = document.getElementById("elevation_chart");
  // Create a new chart in the elevation_chart DIV.
  const chart = new google.visualization.ColumnChart(chartDiv);
  // Extract the data from which to populate the chart.
  // Because the samples are equidistant, the 'Sample'
  // column here does double duty as distance along the
  // X axis.
  const data = new google.visualization.DataTable();

  data.addColumn("string", "Sample");
  data.addColumn("number", "Elevation");

  for (let i = 0; i < results.length; i++) {
    data.addRow(["", results[i].elevation]);
  }

  // Draw the chart using the data within its DIV.
  chart.draw(data, {
    height: 150,
    legend: "none",
    // @ts-ignore TODO update to newest visualization library
    titleY: "Elevation (m)",
  });
}

window.initMap = initMap;
উদাহরণ দেখুন