How to display a google map in flask/django?

Question

There’s not much to be said about it except for the absence of any form of documentation having the least possible understandable way of doing it. Google’s documentation only includes JS snippets that are good enough if I know how to use them in flask, django, or whatever python web framework.

Asked By: user12690225

||

Source

Answer 1

With Flask and Django you make HTML pages in the end, and from Flask you can just return some HTML with the parameters you need.

The Google maps embed API uses an iframe, so you can display a map on your page like this:

<iframe
  width="600"
  height="450"
  style="border:0"
  loading="lazy"
  allowfullscreen
  referrerpolicy="no-referrer-when-downgrade"
  src="https://www.google.com/maps/embed/v1/place?key=API_KEY
    &q=Space+Needle,Seattle+WA">
</iframe>

"You can set the Maps Embed API URL as the src attribute of an iframe" says the doc with that in https://developers.google.com/maps/documentation/embed/get-started

In your Flask or Django view thing, you can then have for example the geocoordinates of the map place you want, gmaps has had a nice API for ages.

For adding markers, heatmaps etc. from code, the Maps client side JS api works, so you’d do that on the client but can get data for the front JS code from your Python backend. I have a simple old gmaps app that is browser side JS only, reads the marker data from a JSON, in https://github.com/playsign/insideoulu/blob/master/map.js

Answered By: antont

Answer 2

There is an extension in flask it only requires

Jinja
Flask
A google api key

And to use in your project use thy dependency manager and pip-install it like this

pip install flask-googlemaps

For how-to-use check out their documentation here it’s pretty straightforward.

Answered By: Hilario Nengare

How to display a google map in flask/django?

Question:

Answers: