Maps
Learn how to add the map view collection display to show location data.
If you have location-based data, you might want to use Noloco's map view collection display option to easily show the location of different records on a map.
In this video, learn how to:
Add the map view collection display in your Noloco app
Add your Google Maps API key in app settings
Configure your Map view with latitude and longitude fields
Find a location's latitude and longitude in Google Maps
Configure what fields show in the map sidebar list
You must add a Google Maps API key via your app settings to use the Map view
What data type should I choose for my latitude and longitude fields?
To ensure the Map view will work correctly, make sure to store your latitude and longitude values in a decimal field type.
A latitude field must contain 2 digits followed by .000000 (6) decimal points precision and a longitude field must contain 2-3 digits followed by .000000 (6) decimal points precision.
Latitude and Longitude numbers are in decimal degrees format and range from -90 to 90 for latitude and -180 to 180 for longitude.
For example:
A Latitude field might look like: 37.809971
A Longitude field might look like: -122.296508
How do I get a Google Maps API key?
To use the map collection layout you must first add a Google Maps API Key. This is free, and your usage will likely fall under the Google Maps free tier. Learn more about Google Maps platform billing.
Create a Google Cloud Platform account (for free)
Go to the Google Maps Platform > Credentials page
On the Credentials page, click "Create credentials > API key"
Copy the newly created API key
Optionally, restrict your API key by specifying your Noloco app domain as an allowed referrer. Learn more about restricting Google Maps API keys.
Note that your default Noloco app domain will be of the format yourdomain.noloco.co
How do I add my Google Maps API key to my Noloco app?
Copy the newly created API key from the page above
Go to the Settings > Integrations & API keys menu
Click to edit your Google Maps API key
Enter your API key and click 'Save'
Last updated
