কাছাকাছি অনুসন্ধান, কাছাকাছি অনুসন্ধান

কাছাকাছি অনুসন্ধান (নতুন) এক বা একাধিক স্থানের ধরন নেয় এবং মিলিত স্থানগুলির একটি তালিকা প্রদান করে।

কাছাকাছি অনুসন্ধান (নতুন) আপনার নির্দিষ্ট করা স্থানের ধরনগুলির উপর ভিত্তি করে স্থানগুলির একটি সেট সম্পর্কে তথ্য প্রদান করে — উদাহরণস্বরূপ restaurant বা book_store বা bowling_alley । পরিষেবাটি নির্দিষ্ট locationRestriction ব্যাসার্ধের মধ্যে নির্দিষ্ট স্থানের প্রকারের সাথে মিলে যাওয়া স্থানগুলির একটি তালিকার সাথে প্রতিক্রিয়া জানায়।

কাছাকাছি অনুসন্ধান (নতুন) ব্যবহার করতে, আপনাকে অবশ্যই আপনার Google ক্লাউড প্রকল্পে "স্থানীয় API (নতুন)" সক্ষম করতে হবে৷ বিস্তারিত জানার জন্য শুরু করুন দেখুন।

কাছাকাছি জায়গা খুঁজুন

নির্দিষ্ট স্থানের ধরন, অবস্থান এবং ব্যাসার্ধের উপর ভিত্তি করে স্থানগুলির একটি তালিকা ফেরত দিতে searchNearby কল করুন। একটি অনুরোধ ব্যবহার করে অনুসন্ধান পরামিতি নির্দিষ্ট করুন, এবং তারপর searchNearby কল করুন। ফলাফলগুলি Place অবজেক্টের একটি তালিকা হিসাবে ফেরত দেওয়া হয়, যেখান থেকে আপনি স্থানের বিবরণ পেতে পারেন। নিচের স্নিপেটটি searchNearby জন্য একটি অনুরোধ এবং একটি কলের উদাহরণ দেখায়:

টাইপস্ক্রিপ্ট

// Restrict within the map viewport.
let center = new google.maps.LatLng(52.369358, 4.889258);

const request = {
    // required parameters
    fields: ['displayName', 'location', 'businessStatus'],
    locationRestriction: {
        center: center,
        radius: 500, 
    },
    // optional parameters
    includedPrimaryTypes: ['restaurant'],
    maxResultCount: 5,
    rankPreference: SearchNearbyRankPreference.POPULARITY,
    language: 'en-US',
    region: 'us',
};

//@ts-ignore
const { places } = await Place.searchNearby(request);

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

// Restrict within the map viewport.
let center = new google.maps.LatLng(52.369358, 4.889258);
const request = {
  // required parameters
  fields: ["displayName", "location", "businessStatus"],
  locationRestriction: {
    center: center,
    radius: 500,
  },
  // optional parameters
  includedPrimaryTypes: ["restaurant"],
  maxResultCount: 5,
  rankPreference: SearchNearbyRankPreference.POPULARITY,
  language: "en-US",
  region: "us",
};
//@ts-ignore
const { places } = await Place.searchNearby(request);
  • এক বা একাধিক ডেটা ক্ষেত্রের একটি কমা-বিভাজিত তালিকা নির্দিষ্ট করতে fields প্যারামিটার (প্রয়োজনীয়) ব্যবহার করুন।
  • 50,000 মিটার পর্যন্ত ব্যাসার্ধ নির্দিষ্ট করতে locationRestriction প্যারামিটার (প্রয়োজনীয়) ব্যবহার করুন।
  • অনুসন্ধান করার জন্য এক বা একাধিক স্থানের ধরন নির্দিষ্ট করতে includedPrimaryTypes প্যারামিটার ব্যবহার করুন।
  • POPULARITY বা DISTANCE এর একটি SearchNearbyRankPreference নির্দিষ্ট করতে rankPreference প্যারামিটার ব্যবহার করুন।
  • প্যারামিটারের সম্পূর্ণ তালিকা দেখুন।

উদাহরণ

নিম্নলিখিত উদাহরণটি কেন্দ্রের 500 মিটার ব্যাসার্ধের মধ্যে রেস্তোরাঁগুলির জন্য অনুসন্ধান করতে searchNearby ব্যবহার করে এবং ফলাফলগুলি দেখানোর জন্য মার্কার সহ একটি মানচিত্র তৈরি করে৷

টাইপস্ক্রিপ্ট

let map;

async function initMap() {
    const { Map, InfoWindow } = await google.maps.importLibrary('maps') as google.maps.MapsLibrary;

    let center = new google.maps.LatLng(52.369358, 4.889258);

    map = new Map(document.getElementById('map') as HTMLElement, {
        center: center,
        zoom: 11,
        mapId: 'DEMO_MAP_ID',
    });
    nearbySearch();
}

async function nearbySearch() {
    //@ts-ignore
    const { Place, SearchNearbyRankPreference } = await google.maps.importLibrary('places') as google.maps.PlacesLibrary;
    const { AdvancedMarkerElement } = await google.maps.importLibrary("marker") as google.maps.MarkerLibrary;

    // Restrict within the map viewport.
    let center = new google.maps.LatLng(52.369358, 4.889258);

    const request = {
        // required parameters
        fields: ['displayName', 'location', 'businessStatus'],
        locationRestriction: {
            center: center,
            radius: 500, 
        },
        // optional parameters
        includedPrimaryTypes: ['restaurant'],
        maxResultCount: 5,
        rankPreference: SearchNearbyRankPreference.POPULARITY,
        language: 'en-US',
        region: 'us',
    };

    //@ts-ignore
    const { places } = await Place.searchNearby(request);

    if (places.length) {
        console.log(places);

        const { LatLngBounds } = await google.maps.importLibrary("core") as google.maps.CoreLibrary;
        const bounds = new LatLngBounds();

        // Loop through and get all the results.
        places.forEach((place) => {
            const markerView = new AdvancedMarkerElement({
                map,
                position: place.location,
                title: place.displayName,
            });

            bounds.extend(place.location as google.maps.LatLng);
            console.log(place);
        });

        map.fitBounds(bounds);

    } else {
        console.log("No results");
    }
}

initMap();

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

let map;

async function initMap() {
  const { Map, InfoWindow } = await google.maps.importLibrary("maps");
  let center = new google.maps.LatLng(52.369358, 4.889258);

  map = new Map(document.getElementById("map"), {
    center: center,
    zoom: 11,
    mapId: "DEMO_MAP_ID",
  });
  nearbySearch();
}

async function nearbySearch() {
  //@ts-ignore
  const { Place, SearchNearbyRankPreference } = await google.maps.importLibrary(
    "places",
  );
  const { AdvancedMarkerElement } = await google.maps.importLibrary("marker");
  // Restrict within the map viewport.
  let center = new google.maps.LatLng(52.369358, 4.889258);
  const request = {
    // required parameters
    fields: ["displayName", "location", "businessStatus"],
    locationRestriction: {
      center: center,
      radius: 500,
    },
    // optional parameters
    includedPrimaryTypes: ["restaurant"],
    maxResultCount: 5,
    rankPreference: SearchNearbyRankPreference.POPULARITY,
    language: "en-US",
    region: "us",
  };
  //@ts-ignore
  const { places } = await Place.searchNearby(request);

  if (places.length) {
    console.log(places);

    const { LatLngBounds } = await google.maps.importLibrary("core");
    const bounds = new LatLngBounds();

    // Loop through and get all the results.
    places.forEach((place) => {
      const markerView = new AdvancedMarkerElement({
        map,
        position: place.location,
        title: place.displayName,
      });

      bounds.extend(place.location);
      console.log(place);
    });
    map.fitBounds(bounds);
  } else {
    console.log("No results");
  }
}

initMap();

সিএসএস

/* 
 * Always set the map height explicitly to define the size of the div element
 * that contains the map. 
 */
#map {
  height: 100%;
}

/* 
 * Optional: Makes the sample page fill the window. 
 */
html,
body {
  height: 100%;
  margin: 0;
  padding: 0;
}

এইচটিএমএল

<html>
  <head>
    <title>Nearby Search</title>
    <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>

    <link rel="stylesheet" type="text/css" href="./style.css" />
    <script type="module" src="./index.js"></script>
  </head>
  <body>
    <div id="map"></div>

    <!-- prettier-ignore -->
    <script>(g=>{var h,a,k,p="The Google Maps JavaScript API",c="google",l="importLibrary",q="__ib__",m=document,b=window;b=b[c]||(b[c]={});var d=b.maps||(b.maps={}),r=new Set,e=new URLSearchParams,u=()=>h||(h=new Promise(async(f,n)=>{await (a=m.createElement("script"));e.set("libraries",[...r]+"");for(k in g)e.set(k.replace(/[A-Z]/g,t=>"_"+t[0].toLowerCase()),g[k]);e.set("callback",c+".maps."+q);a.src=`https://maps.${c}apis.com/maps/api/js?`+e;d[q]=f;a.onerror=()=>h=n(Error(p+" could not load."));a.nonce=m.querySelector("script[nonce]")?.nonce||"";m.head.append(a)}));d[l]?console.warn(p+" only loads once. Ignoring:",g):d[l]=(f,...n)=>r.add(f)&&u().then(()=>d[l](f,...n))})
        ({key: "AIzaSyB41DRUbKWJHPxaFjMAwdrzWzbVKartNGg", v: "beta"});</script>
  </body>
</html>

নমুনা চেষ্টা করুন