ย้ายข้อมูลไปยังการค้นหาในบริเวณใกล้เคียงเวอร์ชันใหม่

นักพัฒนาซอฟต์แวร์ในเขตเศรษฐกิจยุโรป (EEA)

หน้านี้อธิบายความแตกต่างระหว่างการค้นหาในบริเวณใกล้เคียงที่ใช้ในคลาส Place (ใหม่) และ PlacesService (เดิม) รวมถึงแสดงข้อมูลโค้ดบางส่วนเพื่อเปรียบเทียบ

  • PlacesService เดิมมีเมธอด nearbySearch() ซึ่งช่วยให้คุณค้นหาสถานที่ภายในพื้นที่ที่ระบุตามคีย์เวิร์ดหรือประเภทได้
  • คลาส Place มีเมธอด searchNearby() ซึ่งช่วยให้คุณค้นหาสถานที่ภายในพื้นที่ที่ระบุตามประเภทสถานที่ได้ โดยใช้ฟิลด์ข้อมูลสถานที่และประเภทสถานที่ที่ขยายเพิ่มเติมเพื่อความยืดหยุ่นที่มากขึ้น

ตารางต่อไปนี้แสดงความแตกต่างหลักๆ บางประการในวิธีการค้นหาในบริเวณใกล้เคียงระหว่างคลาส Place กับ PlacesService

PlacesService (เดิม) Place (ใหม่)
nearbySearch()
 searchNearby()
PlaceSearchRequest SearchNearbyRequest
ต้องใช้ Callback เพื่อจัดการออบเจ็กต์ผลลัพธ์และการตอบกลับ google.maps.places.PlacesServiceStatus ใช้ Promises และทำงานแบบอะซิงโครนัส
ต้องมีการตรวจสอบ PlacesServiceStatus ไม่จำเป็นต้องตรวจสอบสถานะ สามารถใช้การจัดการข้อผิดพลาดมาตรฐานได้ ดูข้อมูลเพิ่มเติม
รองรับเฉพาะการให้น้ำหนักตามสถานที่ตั้ง รองรับการให้น้ำหนักสถานที่และการจำกัดสถานที่
แสดงผลฟิลด์ข้อมูลทั้งหมดที่ใช้ได้ (ชุดย่อยของฟิลด์ที่รองรับ) โดยไม่สามารถจำกัดให้แสดงเฉพาะฟิลด์ที่ต้องการได้ แสดงเฉพาะฟิลด์ข้อมูลสถานที่ที่ขอ โดยคลาส Place มีฟิลด์ที่ขยายและอัปเดตเป็นประจำให้เลือก
จำกัดเฉพาะประเภทสถานที่ที่กำหนดไว้ เข้าถึงประเภทสถานที่ที่เพิ่มขึ้นและอัปเดตเป็นประจำ
รองรับการค้นหาตามข้อความด้วยคีย์เวิร์ด ระบบไม่รองรับการค้นหาตามข้อความ ให้ใช้การค้นหาข้อความ (ใหม่) แทน

การเปรียบเทียบโค้ด

ส่วนนี้จะเปรียบเทียบโค้ดสำหรับวิธีการค้นหาในบริเวณใกล้เคียงเพื่อแสดงความแตกต่างระหว่างบริการ Places กับคลาส Place ข้อมูลโค้ดแสดงโค้ดที่จำเป็นใน API แต่ละรายการเพื่อส่งคำขอการค้นหาตามข้อความ

การค้นหาในบริเวณใกล้เคียง (เดิม)

การค้นหาในบริเวณใกล้เคียงแบบเดิมช่วยให้คุณค้นหาสถานที่ภายในพื้นที่ที่ระบุตามคีย์เวิร์ดหรือประเภทได้ คุณไม่สามารถจำกัดการค้นหาโดยใช้ฟิลด์ข้อมูลสถานที่ได้ ดังนั้นระบบจะแสดงฟิลด์ที่ใช้ได้ทั้งหมดพร้อมกับคำขอแต่ละรายการ ข้อมูลโค้ดต่อไปนี้แสดงการเรียกใช้ nearbySearch() เพื่อแสดงข้อมูลเกี่ยวกับร้านอาหารในซิดนีย์ ประเทศออสเตรเลีย คำขอเป็นแบบซิงโครนัส ใช้ Callback และมีการตรวจสอบแบบมีเงื่อนไขที่จำเป็นใน PlacesServiceStatus

let map;
let service;

function initMap() {
  const sydney = new google.maps.LatLng(-33.867, 151.195);

  map = new google.maps.Map(document.getElementById("map"), {
    center: sydney,
    zoom: 15,
  });

  const request = {
    location: sydney,
    radius: '500',
    type: ['restaurant']
  };

  service = new google.maps.places.PlacesService(map);
  service.nearbySearch(request, callback);
}

function callback(results, status) {
  if (status == google.maps.places.PlacesServiceStatus.OK) {
    for (var i = 0; i < results.length; i++) {
      createMarker(results[i]);
    }
  }
}

// Helper function to create markers.
function createMarker(place) {
  if (!place.geometry || !place.geometry.location) return;

  const marker = new google.maps.Marker({
    map,
    position: place.geometry.location,
    title: place.name,
  });
}

ดูข้อมูลเพิ่มเติม

การค้นหาในบริเวณใกล้เคียง (ใหม่)

การค้นหาในบริเวณใกล้เคียงเวอร์ชันใหม่ได้รับการปรับปรุงจากเวอร์ชันก่อนหน้าในด้านต่อไปนี้

  • ความสามารถในการระบุฟิลด์ข้อมูลสถานที่ที่จะแสดงผล
  • การใช้ Promise ซึ่งช่วยให้ดำเนินการแบบอะซิงโครนัสได้
  • ไม่จำเป็นต้องตรวจสอบสถานะของ PlacesService แต่สามารถใช้การจัดการข้อผิดพลาดมาตรฐานแทนได้

ข้อมูลโค้ดต่อไปนี้แสดงฟังก์ชันที่ส่งคำขอการค้นหาในบริเวณใกล้เคียงสำหรับร้านอาหาร ตัวอย่างนี้แสดงการใช้ตัวเลือก rankPreference เพื่อจัดอันดับผลการค้นหาตามความนิยม (ในเวอร์ชันก่อนหน้า การจัดอันดับจะระบุโดยใช้ตัวเลือก rankBy) เนื่องจากเมธอด searchNearby() ใช้โอเปอเรเตอร์ await จึงใช้ได้เฉพาะภายในฟังก์ชัน async เท่านั้น

async function nearbySearch() {
  // 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: google.maps.places.SearchNearbyRankPreference.POPULARITY,
    language: "en-US",
    region: "us",
  };

  const { places } = await google.maps.places.Place.searchNearby(request);

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

    // Create a new bounds, which will be extended with each result.
    const bounds = new google.maps.LatLngBounds();

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

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

ดูข้อมูลเพิ่มเติม