-
Notifications
You must be signed in to change notification settings - Fork 823
/
index.js
84 lines (74 loc) · 2.64 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
/**
* @license
* Copyright 2024 Google LLC. All Rights Reserved.
* SPDX-License-Identifier: Apache-2.0
*/
// [START maps_place_autocomplete_data_simple]
/**
* Demonstrates making a single request for Place predictions, then requests Place Details for the first result.
*/
async function init() {
// @ts-ignore
const { Place, AutocompleteSessionToken, AutocompleteSuggestion } =
await google.maps.importLibrary("places");
// [START maps_place_autocomplete_data_simple_request]
// Add an initial request body.
// [START maps_place_autocomplete_data_simple_request_body]
let request = {
input: "Tadi",
locationRestriction: {
west: -122.44,
north: 37.8,
east: -122.39,
south: 37.78,
},
origin: { lat: 37.7893, lng: -122.4039 },
includedPrimaryTypes: ["restaurant"],
language: "en-US",
region: "us",
};
// [END maps_place_autocomplete_data_simple_request_body]
// [START maps_place_autocomplete_data_simple_token]
// Create a session token.
const token = new AutocompleteSessionToken();
// Add the token to the request.
// @ts-ignore
request.sessionToken = token;
// [END maps_place_autocomplete_data_simple_token]
// [END maps_place_autocomplete_data_simple_request]
// [START maps_place_autocomplete_data_simple_get_suggestions]
// Fetch autocomplete suggestions.
const { suggestions } =
await AutocompleteSuggestion.fetchAutocompleteSuggestions(request);
const title = document.getElementById("title");
title.appendChild(
document.createTextNode('Query predictions for "' + request.input + '":'),
);
for (let suggestion of suggestions) {
const placePrediction = suggestion.placePrediction;
// Create a new list element.
const listItem = document.createElement("li");
const resultsElement = document.getElementById("results");
listItem.appendChild(
document.createTextNode(placePrediction.text.toString()),
);
resultsElement.appendChild(listItem);
}
// [END maps_place_autocomplete_data_simple_get_suggestions]
// [START maps_place_autocomplete_data_simple_prediction]
let place = suggestions[0].placePrediction.toPlace(); // Get first predicted place.
// [START maps_place_autocomplete_data_simple_fetch]
await place.fetchFields({
fields: ["displayName", "formattedAddress"],
});
// [END maps_place_autocomplete_data_simple_fetch]
const placeInfo = document.getElementById("prediction");
placeInfo.textContent =
"First predicted place: " +
place.displayName +
": " +
place.formattedAddress;
// [END maps_place_autocomplete_data_simple_prediction]
}
init();
// [END maps_place_autocomplete_data_simple]