Plus codes Please

Joel H. Gomez Paredes
7 min readJan 4, 2020

--

Puss in boots says please

Let me tell you a story, I was visiting my family in my town for the holidays, is a nice place far away of the city, the internet connection is not fast but is very quiet. The life style in my town is a little different from the city, the people knows everyone and you find a place asking the people. To celebrate this festivities I decided give a gift to my mom and I ask for it online. At this point everything was normal, for me my address never had changed, it has been the same since I born.

The problem comes later when the delivery company comes to town, because my address was wrong, the people in town included the mailer know my address but the information in GPS (or another systems to find locations) was different, normally that information comes from a government entity (at least in Mexico works in that way). It was complicated give them the instructions to deliver my package but at the end my sister helps me and my mom receives his gift for christmas.

Lost because directions are wrong

After that I was thinking, a city is a living entity, growths, change, business closes, business opens, etc. All this, change the organization: add new numbers in streets, close streets, divide streets, etc. The problem comes when you need find an address, because it comes from humans, there is not a math formula to determine your address, the number of your house (sometimes i walks in the street and see #28, after #45 and after #2, it’s weird but very common in some places) or zip code, all this information is mapped by a state’s organization (government).

With Google maps we can use the geocoding service to translate an address into a location and locate the place in a Map, but this not works fine if the data provided to Google Maps is wrong or is outdated.

So, with the goal to find the official address of my house I used the geocoding service. This service allows me search using a human readable address, a placeId (google identifier for some place) and location (latitude and longitude). When you use the location to get the address is called geocoding reverse (sounds very cool). This service is available in the SDK for your platform or like a web service, you must enabled in GCP).

Request using Geocoding Reverse

Exploring the response I found an interesting thing called Plus Codes (this is included in response object and for every item in property result in response). This called my attention so i was searching what is that?.

Basically a plus code has the same goal of street address (actually is the goal of every address) identify the location of something. With a plus code we can have an address even if we don’t have one (like my mom’s house), no matter if you don’t have a road, even if there is not a map, you can identify a place.

This works because plus codes are based in latitude and longitude, splitting the world in a simple grid to describe an area. Is not ruled for a government, company or institution, is open source project but more important, is free XD.

Image shows a map image divided in a grid, taken from winbuzzer.com

The Plus codes not works to locate a specific point, a plus codes works to locate an area some coordinates can be translated in the same the plus code because that points are in the plus code’s area. The next image illustrates the logic of marker clusters but for this example works

Image shows a map divided in grid and markers inside them, taken from blog.batchgeo.com

The plus codes has two parts:

Area code: 4 characters to find your region the size is almost 100 x 100 km

Local code: 6 characters to find your home or whatever you want, this codes describe an area with size 14 x 14 meters. This is used to describe an area inside the area represented by area code: It’s like a matrix.

Together creates a global code.

Image shows the global code’s composition

Google Maps has added plus codes in his application, but there is a little detail the plus code in the image only have 6 characters (plus symbol is not taken in count). If you have the area you don’t need the area code just local code, but if the area is missing you need to use a global code. Google use the local code in combination with text to indicate the area.

Image shows Search in Google Maps, A good place to eat and the plus code information
Image show the response of geocoding service, plus code object has compound code attribute.

Actually if you need more precision you can add another character, but normally plus code is only 10 character. You can have more information in the plus code’s page

So, to demonstrate how you can add plus code to your application I gonna build something very simple, a map where when you click this gives you the plus code and a search box where you can find a location using a plus code (for the moment just supporting global codes).

When you click in map, the map is center in location, put a marker and gives you the plus code
When you search a place using plus codes, the map is center in location and put a marker

Before to start you need download the code in my repository with another maps samples, enter to the plus-codes folder and follow the instructions.

For this project I add a library developed by google called open location codes, this includes methods to encode and decode a plus codes. After that … well that’s all you don’t need more, because plus codes doesn’t need other libraries or services to work, remember is based in coordinates, but unfortunately there is not support in geocoding service in google for searching using this criteria (cof, cof, google add it please) to make something more interesting.

Update Google add the support for Plus Codes in the next section I show you an example

You can use the encode method to translate coordinates into plus code and decode method to translate plus_code into coordinates.

If you want to use the geocoding service of google using plus codes you can use the plus code and use method decoding. This returns a codeArea object, and have properties like south west and north-east coordinates to use in bounds, draw a square or whatever you want, etc.The coordinates of the center of plus code.

I recommend you the plus code page it has a tool to search cities plus codes and is very useful, in other posts i gonna share with you more details about Open Location Codes library and how works in combination with google maps to bring better experiences.

Google Maps Platform supporting Plus Codes

According with Google we can use plus codes in Geocoding API, how? Well is very simple actually, we just need to provide the plus code in the request using the parameter address, like next example (You can test with the next plus codes 76C65R48+45, 76F2CQHV+F8):

Geocoding using plus codes (Global Code)
Geocoding using plus codes (Compound Code)

Now you have the ability to use Geocoding API using Plus Code, and Places API has support too (just remember set to your API key the permissions):

Place API Autocomplete

And the Autocomplete in JS API has support too (if you wanna see an example of autocomplete click here), we gonna use the example I’ve made for this post. Go to index.js and change the value of variable useAutocomplete to true …thats all (If you have used the Autocomplete you don’t need to change any code in your apps to add support :D ).

useAutocomplete with value false

Now we can search using plus codes :D

Search using autocomplete with plus code 76F2CQHV+F8
Search with Plus code 76C65R48+45

It was exciting review this new feature, I hope you can use it in the future and integrate it with your systems and do great things :D

--

--

Joel H. Gomez Paredes

Frontend Developer at Platzi, Google Developer Expert in Web Technologies And Google Maps Platform, A Reverse Developer & Fullsnack JS Developer