I have always wondered how an application is able to show a particular address on a map. You provide an address and in return, get a beautiful looking map. For instance, all of us have used ride-sharing applications. These ask you for a destination, you type an address and it's location is immediately highlighted on a map. There are many examples of this, ranging from food and package delivery to safety and health management. If yo think about, it's remarkable how often we use this particular feature in our everyday lives.
Lets see how it works by creating our own search application with the help of Python and few HERE APIs. I would suggest you to check my previous blog on how to start with a Map using Python.
Your machine should have Python installed (I have Python 3.8) and if you haven't done so yet, you will need to sign up for a Freemium account on developer.here.com. Once you signed up, you can generate your free API key and get 250.000 free transactions every month.
Getting the Geocoder API
The fascinating feature of an application, where it takes an address from you and shows it on a map is handled by Geocoder API. This API finds you the geo-coordinates of a known address, place, locality or administrative area, even if the query is incomplete or partly incorrect.
After we've create our API Key, we have to acquire Geocoder API. This API will convert our text (e.g. a city name) to a geo-coordinate (latitude and longitude).
The API is RESTful one, and returns a JSON, containing detailed information about the location that we searched. The basic API call looks like this.
Here the apikey is part of the credentials you generated when signing up for your Freemium account and the value of q is a query string for the location you want to geocode.
We are going to parse the JSON response using Python to acquire the latitude and longitude of a searched location.
Working with Python
Part of what makes Python so powerful is the huge collection of available libraries. We need to import one Python library here, requests, to handle GET requests and their response.
Install the library with 'pip install requests' using Python IDE (PyCharm, Spyder, etc) or terminal/command prompt depending on how you are working on Python (I am using the command prompt), and then import it in the code.
In the above code, we are asking user to enter a location (a city) and parsing the JSON to get latitude and longitude of that location (location is acquired by user). To see the values, you add print (latitude) and print (longitude) at the end of the code.
Now, we have latitude and longitude of a place. Next, we have to show it in a HERE map on a browser. This can be done easily with the help of flask. Flask is a simple and powerful micro-framework for web-applications in Python.
For this, we need a library named flask, which can be downloaded using the command - pip install flask
Now, let’s integrate all the values collected so far - latitude, longitude and API Key into the flask code.
The above code represents a simple flask template in which we have imported two sub-packages of flask, viz., Flask and render_template. Also, we have created a function called the “map_func”. This function returns a jinga2 html page and passes the API Key, latitude and longitude to our HTML code (yes, we will need HTML too).
A HTML file will be required to show the Map on the browser. For this, we need to create an HTML file in a folder called “templates”, and then name the file as “map.html”
In the <head> of HTML file, add the following <script> elements to load the API code libraries,
Next, we need to initialize the communication with the back-end services and initialize the map in the <body> of HTML inside the <script>.
The complete Python Code.
All you need is to provide your own API key from Developer Portal to api_key in the above code.
The complete HTML code(HTML file should be inside the templates folder and make sure that the template folder and python code are in same location).
Running the Code
Open command prompt or terminal and run the Python code(as shown in image below). Alternatively, you can also run code in an IDE like Spyder, PyCharm, etc.
You will now be asked to enter a location. For your first test, enter only one word, preferably the city. Later you can try for an address. As you can see below, I have entered 'Berlin' as the location.
An IP address will appear, http://127.0.0.1:5000 in response to the city you enter (see in the above image).
Copy this address and paste it in any of the browser application (Chrome, Mozilla, Microsoft Edge, etc). In response you will get the map image showing a marker on Berlin.
You saw how to plot a location on a Map when you just have a name. In the process we used Geocoder API for text to geo-coordinate conversion, Map API for plotting the geo-coordinate on a Map and Python to make it all happen. In next part we will explore more feature that can be included. Till then, keep learning!