Reverse Geocoding App - Get Location from Latitude/Longitude

This tutorial will show you how to retrieve a location given a Latitude and Longitude.
We will use the Location Sensor to get the Latitude and Longitude for this app.
This app will return the country you are currently in.

This app uses the OpenCageData API. You can get an API key for it here.

Design
Design

The Design for this app is extremely simple: A Button and a Label.
You’ll need to add a Web API component and a Location Sensor to this app.

Blocks

The only variable we need for this app is the API key I mentioned above. Set the variable API to this key.

getkey

variable

The API URL is in the form https://api.opencagedata.com/geocode/v1/json?q=LAT+LNG&key=YOUR-API-KEY.

We need to use a join block to get this URL from our Latitude, Longitude and API key.
We have already set the app variable ‘API’ to our API key, now we just need to use the Location Sensor to get our current Latitude and Longitude.

The following blocks get the current location, then piece together the API URL.

Before we look at the GetResponse function, let’s look at the OpenCage API. You can access a demo of the API here, which lets you look at a sample JSON response.

Make sure the ‘Reverse Geocoding’ option is selected, then click the ‘Geocode’ button, then click the ‘JSON Response’ tab.

I’ll use this demo’s sample co-ordinates when I get the Web API response so you should be able to follow along and narrow down the information we’re getting from this API.

We want to return the property ‘country’. Looking at this response, ‘country’ is inside ‘components’…

countryparent

…and ‘components’ is in ‘results’.

So we want the property ‘country’ of the property ‘components’ of the property ‘results’ of our response!

Let’s start by getting the ‘response’ of our API:

response

Then the property ‘results’ of this response:

We can see that this response is in square brackets, which means that any future blocks will treat this as a 1-item list rather than a single item.

We can get around this by treating it like a list ourselves, and getting the first item of this ‘list’ - which is the response object.

We can see that the response no longer has square brackets around it:

So now we get the property ‘components’ of ‘results’:

While you can obviously display whatever properties you want from here, we’re going to get the ‘country’ property:

And there we are! Feel free to use some Text blocks to reformat this response however you want.

You can find a copy of this app here.

9 Likes

So cool – thanks for putting this together Jane!

2 Likes

I’m glad you like it! :smile:

Hi @jane I have also another version for another idea of Geolocation API with Opencage

Cheers!

2 Likes

Thanks for sharing your project with us @junjoseph - I haven’t had a chance to look at the blocks yet, but is there any major difference between your approach and Janes? It might be better suited to the #ShareYourApps category??

1 Like

Hi @domhnallohanlon We have same idea I just try to create simple and full length address that anyone maybe like it. I research also about another API around the web for the possible compatible API for thunkable like mapbox for measuring distance from user to client. but for now I creating best UI simple for anyone like to see in their phones.

2 Likes

Hi @jane

Thanks for the awesome tutorial!!!

quick question, just out of curiosity once you obtain the property values for “results” you use a "generate JSON from object"block to display the response on the label. am rather new to json so I just want to understand

Hey @sleon003x2rq

The reason for this conversion is so that the resulting JSON can be used with our built-in List blocks.