Di chuyển sang Nearby Search mới

Nhà phát triển ở Khu vực kinh tế Châu Âu (EEA)

Trang này giải thích sự khác biệt giữa tính năng Nearby Search được dùng trong lớp Place (mới) và lớp PlacesService (cũ), đồng thời cung cấp một số đoạn mã để so sánh.

  • PlacesService cũ có phương thức nearbySearch(), cho phép bạn tìm kiếm địa điểm trong một khu vực cụ thể theo từ khoá hoặc loại.
  • Lớp Place có phương thức searchNearby() cho phép bạn tìm kiếm địa điểm trong một khu vực cụ thể theo loại địa điểm, sử dụng lựa chọn mở rộng gồm các trường dữ liệu địa điểm và loại địa điểm để tăng tính linh hoạt.

Bảng sau đây liệt kê một số điểm khác biệt chính trong các phương thức tìm kiếm lân cận giữa lớp Place và PlacesService:

PlacesService (Cũ) Place (Mới)
nearbySearch()
 searchNearby()
PlaceSearchRequest SearchNearbyRequest
Yêu cầu sử dụng lệnh gọi lại để xử lý đối tượng kết quả và phản hồi google.maps.places.PlacesServiceStatus. Sử dụng Promise và hoạt động không đồng bộ.
Cần có quy trình kiểm tra PlacesServiceStatus. Không cần kiểm tra trạng thái, có thể sử dụng quy trình xử lý lỗi tiêu chuẩn. Tìm hiểu thêm.
Chỉ hỗ trợ thiên vị vị trí. Hỗ trợ thiên vị vị trí và hạn chế vị trí.
Trả về tất cả các trường dữ liệu có sẵn (tập hợp con của các trường được hỗ trợ); không thể bị ràng buộc với các trường cụ thể. Chỉ trả về các trường dữ liệu địa điểm được yêu cầu; lớp Place cung cấp một lựa chọn mở rộng và được cập nhật thường xuyên về các trường.
Giới hạn ở một nhóm loại địa điểm cố định. Sử dụng danh sách loại địa điểm mở rộng và được cập nhật thường xuyên.
Hỗ trợ tìm kiếm dựa trên văn bản bằng từ khoá. Tính năng tìm kiếm dựa trên văn bản không được hỗ trợ, hãy sử dụng Tìm kiếm văn bản (Mới).

So sánh mã

Phần này so sánh mã cho các phương thức Nearby Search để minh hoạ sự khác biệt giữa Dịch vụ địa điểm và lớp Địa điểm. Các đoạn mã cho thấy mã cần thiết trên mỗi API tương ứng để thực hiện yêu cầu tìm kiếm dựa trên văn bản.

Nearby Search (Cũ)

Tính năng Nearby Search cũ cho phép bạn tìm kiếm địa điểm trong một khu vực cụ thể theo từ khoá hoặc loại. Không có cách nào để ràng buộc nội dung tìm kiếm bằng cách sử dụng các trường dữ liệu địa điểm, vì vậy, tất cả các trường có sẵn đều được trả về theo mỗi yêu cầu. Đoạn mã sau đây cho thấy cách gọi nearbySearch() để trả về thông tin về các nhà hàng ở Sydney, Úc. Yêu cầu này là đồng bộ, sử dụng lệnh gọi lại và bao gồm một bước kiểm tra có điều kiện bắt buộc trên 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,
  });
}

Tìm hiểu thêm

Nearby Search (Mới)

Phiên bản mới của Nearby Search cải thiện phiên bản tiền nhiệm theo những cách sau:

  • Khả năng chỉ định trường dữ liệu địa điểm cần trả về.
  • Việc sử dụng Promise cho phép hoạt động không đồng bộ.
  • Bạn không cần kiểm tra trạng thái của PlacesService; thay vào đó, bạn có thể sử dụng cách xử lý lỗi tiêu chuẩn.

Đoạn mã sau đây cho thấy một hàm thực hiện yêu cầu Nearby Search cho các nhà hàng. Ví dụ này cho thấy cách sử dụng tuỳ chọn rankPreference để xếp hạng kết quả tìm kiếm theo mức độ phổ biến (trong phiên bản trước, thứ hạng được chỉ định bằng tuỳ chọn rankBy). Vì phương thức searchNearby() sử dụng toán tử await nên chỉ có thể dùng phương thức này bên trong hàm 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");
  }
}

Tìm hiểu thêm