Google Maps API

Hi guys,

I’m trying to setup a feature on my site which is a search box connected to the Google Maps API. The ideal scenario is that the user enters their current location, the Google Maps Timezone API would then convert this to their current timezone and display this value on the site. I had hoped this might be possible to do with the generic search box element set to Geographic places but I can’t seem to get any functionality out of this at all?

Would anybody have any ideas on how to implement this?

thanks so much

If you’re looking to do this solely for the current user based on their current location, you can use the “Current geographic position” expression. (Here’s a quick walkthrough of how to access it.

Note: the user needs to allow location access for your app. (If they haven’t done so, they’ll see a popup in the browser asking for permission). It may take a few seconds to populate at first.

Dan (creator of LearnTo - 100+ really useful Bubble tutorials)

That’s amazing! Thanks so much for that :slight_smile:

Would it be possible to do this without the current users location, but rather a location determined by the value entered in a search box?

i.e. the user would enter “Denmark”. As the user started typing, the search box would auto-suggest from the Google maps API, and then then the rest of the process as outlined in the video you linked to would take place to work out the timezone. Could that work?

Thanks again for your help

Correct, the setup is pretty much the same when you want to use the address search.

Just be sure that you’re using a searchbox and that the choices style is set to geographic places. Here’s a demo video.

1 Like

Amazing! Thanks so much for the video. I didn’t realise it would be so simple!

Unfortunately, I can’t get the search box working. Thinking it’s something to do with the API keys I’ve set as both the maps API key and the Geocode key are the exact same as this is what it’s showing me in my Google Cloud console. Should this be the case? Seems strange.

Thanks so much again :slight_smile::pray:

Typically when the search box isn’t displaying results, it’s because some of the relevant Google Maps APIs weren’t enabled when you created your API keys. (Another) video walkthrough below. :smiley:

2 Likes

Amazing! Thanks so much for your help. Got it working now. Strangely, the option to display “offset from UTC” doesn’t work, although the other options i.e. “timezone ID” etc. all work. Would you have any ideas how I can get that working?

Thanks so much again for all your help

Glad that pointed you in the right direction.

As for the UTC component, could you share screenshots of what you’re seeing. Not sure I immediately know what aspect your referencing.

Sure thing! This is the setting I am trying to get working. The output I’m looking for would be something like "UTC+5"

I believe the result that you get is formatted in minutes, so you need to “convert” it to hours by dividing by 60. (Then, manually add in the text for UTC).

Setup

Looks like

Amazing! That’s awesome.

Thanks so much for your help! :pray:

1 Like