Cleo
Cleo

Reputation: 13

Address Search for the Google Map widget on App Maker

I see the Google Map widget documentation for App Maker says I can bind a datasource to it so that user can input an address to update the map. Is it possible to bind it to something like a Places search box in App Maker?

It'd be great if I don't need to create my own datasource to enable an address search.

Upvotes: 1

Views: 813

Answers (2)

To complete Pavel Shkleinik answer,

We do not need to authenticate using the Maps.setAuthentication('your_client_id', 'your_signing_key');

see here : https://developers.google.com/apps-script/reference/maps/maps#setAuthentication(String,String) This method doesn't work with API keys. Additionally, please note that Premium Plan is no longer available for new customers. If you don't already have a Premium Plan license, please don't call setAuthentication(clientId, signingKey). You are able to use the Maps methods with the default quota allowances.

Also, I had to use a default value for the Address field the auto-complete to work. If I didn't use a default value, the Query would return a null.

See here

Upvotes: 0

Pavel Shkleinik
Pavel Shkleinik

Reputation: 6347

You can build Address Search using Suggest Box, Calculated Datasource and Geocoder Apps Script service

/**
 * Creates address suggestion record.
 * @param {Object} geocode Geocode object received from Maps Geocoder.
 * @return {AddressSuggestion} Created suggestion record.
 */
function createAddressSuggestion_(geocode) {
  var record = app.models.AddressSuggestion.newRecord();
  record.Address = geocode.formatted_address;
  return record;
}


/**
 * Gets address suggestions Maps Geocoder.
 * @param {string} term Start of address string to search for.
 * @return {Array<AddressSuggestion>} Array of suggestion records.
 */
function getAddressSuggestions_(term) {
  // TODO: Uncomment to set clientId and Google Maps API Key
  // Maps.setAuthentication('your_client_id', 'your_signing_key');

  var response = Maps.newGeocoder().geocode(term);
  var geocodes = response.results;

  return geocodes.map(createAddressSuggestion_);
}

Datasource

One more important important thing: you need to say Suggest Box to handle your datasource as whole records otherwise it will filter out all results that have no exact match with your _startsWith term: Record as value

Upvotes: 1

Related Questions