This page explains the differences between nearby search as used in the
Place
class (new) and the
PlacesService
(legacy), and provides some code snippets for comparison.
- The legacy
PlacesService
has anearbySearch()
method, which lets you search for places within a specified area by keyword or type. - The
Place
class has asearchNearby()
method which lets you search for places within a specified area by place type, utilizing an expanded selection of place data fields and place types for greater flexibility.
The following table lists some of the main differences in nearby search methods
between the Place
class and PlacesService
:
PlacesService (Legacy) |
Place (New) |
---|---|
nearbySearch() |
searchNearby()
|
PlaceSearchRequest |
SearchNearbyRequest |
Requires the use of a callback to handle the results object and
google.maps.places.PlacesServiceStatus response. |
Uses Promises, and works asynchronously. |
Requires a PlacesServiceStatus check. |
No required status check, can use standard error handling. |
Supports only location bias. | Supports location bias and location restriction. |
Returns all available data fields (a subset of the supported fields); cannot be constrained to specific fields. | Returns only the requested place data fields; the Place class offers an expanded and regularly
updated selection of fields. |
Limited to a fixed set of place types. | Access an expanded and regularly updated selection of place types. |
Supported text-based search with the keyword. | Text-based search is not supported, use Text Search (New) instead. |
Code comparison
This section compares code for nearby search methods to illustrate the differences between the Places service and the Place class. The code snippets show the code required on each respective API to make a text-based search request.
Nearby Search (Legacy)
The legacy Nearby Search lets you search for places within a specified area by
keyword or type. There is no way to constrain searches by using place data
fields, so that all of the available fields are returned with each request.
The following snippet shows calling nearbySearch()
to return information about
restaurants in Sydney, Australia. The request is synchronous, uses a callback,
and includes a required conditional check on 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,
});
}
Learn more
Nearby Search (New)
The new version of Nearby Search improves upon its predecessor in the following ways:
- The ability to specify which place data fields to return.
- The use of Promises which enables asynchronous operation.
- No need to check for the status of
PlacesService
; standard error handling can be used instead.
The following code snippet shows a function which makes a Nearby Search request
for restaurants. This example shows using the rankPreference
option to rank
search results by popularity (in the previous version ranking is specified
using the rankBy
option). Because the searchNearby()
method uses the await
operator it can only be used inside an async
function.
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");
}
}