Service Application: Taking A Picture Part 2

Simon Leen
4 min readOct 24, 2021

--

Objective: Integrating Google Maps API with Unity

To get started, go to the Google Maps Platform and click Get Started. New users will have to set up a billing profile but there is a free tier which will be fine for the project.

Once in, you need to create a project.

Once created you will see the following Dashboard. Select the Maps Static API.

You can see in the above image that you get a nice monthly allowance free before getting charged so lets hit enable and get moving.

The project now has one API enabled. Click into Credentials on the left to see the API key, Secret Key Generator and to Sign a URL(not shown for security) but more on this later. For now back to Unity.

Open the LocationPanel script and create a public string for the API key and paste your key into the inspector of the Location Panel.

Using the Static Maps API requires some parameters but if you want to view the guide for a full breakdown, you’ll find it here. For what we need we will use https://maps.googleapis.com/maps/api/staticmap?parameters and the parameters will a center parameter to focus the map, X and Y coordinates, a zoom rate for how close the map image will be, a resolution for the image and finally our API key. Example below:

https://maps.googleapis.com/maps/api/staticmap?center=40.714728,-73.998672&zoom=12&size=400x400&key=YOUR_API_KEY

Next we set up the variables in the LocationPanel script and the initial part of the request URL.

Next we use the OnEnable method which will run contained code when the panel/screen is enabled. I’ve included two variations of the OnEnable incase anyone reading this hasn’t used or come across String Interpolation.

With String Interpolation
Without String Interpolation

Now’s where the fun begins. To use Maps we need to use the namespace UnityEngine.Networking so we add that first. We’ll need to do two steps each using a coroutine to get it to work. The first step is setting up location services. If you want to go through the docs, you’ll find what was used here.

In brief, we call/start the coroutine(GetLocation) from the OnEnable method. We then check if the phones location service is enabled and stop if not. we then start the location services before querying the location followed by setting a wait period for the services to start up and stopping if timed out. We then check if the connection has given failed response and again stop if not successful. If successful the X and Y coordinate variables are set using the input returned latitude and longitude. The input location is then stopped before calling the next coroutine.

Before these changes we were updating the mapURL string in the OnEnable method. That will now be called in the next coroutine(GetStaticMap) instead.

In this coroutine we set the MapURL first which uses the newly assigned coordinates. The project is done in Unity 2020 so we use Unitys own web request process to send/post the requesting URL to Google. We then yield, waiting for a response. The response is checked and if anything but successful, the request error is logged. Otherwise the map(RawImage set in the variables) texture is set to the returned texture(static map image).

Unfortunately, location services don’t work in the editor. An Android APK is built and transferred to a phone for testing. You can also use Unitys Unity Remote if your phone had developer options enabled and is connected to the PC by USB. Make sure location services are enabled on the phone and if like me, testing on a Samsung with App Locked Services, enable the app after installing to use location. The UI for the Buttons on the bottom Nav are a bit off but this can be fixed later with some adjustements but the location services and Static Map image are working.

--

--

No responses yet