Generate static map image

[Chem]

I’d like to demonstrate how to generate a static map using the Google Maps API

Feel free to check out a demo here: https://tutorials.tadabase.io/street-view-test/default

To start, add a Text Formula to any table that has an Address field. The text formula will be made up of the following parts

1. https://maps.googleapis.com/maps/api/staticmap?center=
2. Add Field > Address - Address field.
3. &zoom=13&size=600x300&maptype=roadmap&markers=color:red%7Clabel:%7C
4. Add Field > Address - Latitude
5. ,
6. Add Field > Address - Longitude
7. &key=YOUR_GOOGLE_API_KEY (You can create an API key in the Google Developers Console.)

The end result should look like this

To add this into a List Component, you may add the following to HTML inside a List. (Change field_id to the Text Formulas field slug)

<p><img src="{!!field_id!!}" alt="" width="100%" /></p>

To add this to a PDF, add an HTML Component and add the following to the Source Code.
Change “Text Formula” to the name of your Text Formula Field.

<p><img src="{!!Text Formula!!}" alt="" /></p>
<p style="display: none;">{Text Formula}</p>

[Chem]

If you’d like to display a Street View, a very similar Text Formula can be used.

1. https://maps.googleapis.com/maps/api/streetview?size=1800x1800&location=
2. Add Field > Address - Address
3. Add Field > Address - City
4. Add Field > Address - State
5. Add Field > Address - Country
6. &source=outdoor&key=YOUR_GOOGLE_API_KEY

[DanioA]

@Chem
Chem,
i am trying to use this solution but something is not working.
I don’t have a full address field, I just have the coordinates.
I’ve made several attempts but it doesn’t work.

Would you have a solution?
Thank you

[Sam]

@DanioA looks like you forgot the comma between latitude and longitude. See if that helps.

[DanioA]

Yes you are right,
thank you