Skip to main content

Small extension for Flask to make using Google Maps easy

Project description

# Flask Google Maps

Easy to use Google Maps in your Flask application

### requires
- Jinja
- Flask
- A google api key (optional I guess)

### Installation

```pip install flask-googlemaps```


git clone
cd Flask-GoogleMaps
python install

### How it works

Flask-GoogleMaps includes some global functions and template filters in your Jinja environment, also it allows you to use the Map in views if needed.

#### registering

in your app

from flask import Flask
from flask_googlemaps import GoogleMaps

app = Flask(__name__)

In template

{{googlemap("my_awesome_map", lat=0.23234234, lng=-0.234234234, markers=[(0.12, -0.45345), ...])}}

That's it! now you have some template filters and functions to use, more details in examples and screenshot below.

### Usage

- You can create the map in the view and then send to the template context
- you can use the template functions and filters directly

#### 1. View

from flask import Flask, render_template
from flask_googlemaps import GoogleMaps
from flask_googlemaps import Map

app = Flask(__name__, template_folder=".")

def mapview():
# creating a map in the view
mymap = Map(
markers=[(37.4419, -122.1419)]
sndmap = Map(
markers={'':[(37.4419, -122.1419)],
'':[(37.4300, -122.1400)]}
return render_template('example.html', mymap=mymap, sndmap=sndmap)

if __name__ == "__main__":

##### `Map()` Parameters:

- **lat**: The latitude coordinate for centering the map.
- **lng**: The longitutde coordinate for centering the map.
- **zoom**: The zoom level. Defaults to `13`.
- **maptype**: The map type - `ROADMAP`, `SATELLITE`, `HYBRID`, `TERRAIN`. Defaults to `ROADMAP`.
- **markers**: Markers array. Defaults to `None`.
- or **markers**: Markers dictionary with icon urls as keys and markers array as values.
- **varname**: The instance variable name.
- **style**: A string containing CSS styles. Defaults to `"height:300px;width:300px;margin:0;"`.
- **identifier**: The CSS ID selector name.
- **cls**: The CSS Class selector name. Defaults to `"map"`.

#### 2. Template

<!DOCTYPE html>
{{"decoupled-map"|googlemap_js(37.4419, -122.1419, markers=[(37.4419, -122.1419)])}}
<h1>Flask Google Maps Example</h1>

<h2> Template function centered, no marker </h2>
{{googlemap("simple-map", 37.4419, -122.1419)}}

<h2> Template filter decoupled with single marker </h2>
{{"decoupled-map"|googlemap_html(37.4419, -122.1419)}}

<h2> Template function with multiple markers </h2>
{% with map=googlemap_obj("another-map", 37.4419, -122.1419, markers=[(37.4419, -122.1419), (37.4300, -122.1400)]) %}
{% endwith %}

<h2> First map generated in view</h2>

<h2> Second map generated in view</h2>
<h3> Example for different icons in multiple markers</h3>



### Screenshot

<img src="screenshot.png" />

### TODO:

Implement other methods from the api, add layers etc...

[![Bitdeli Badge](]( "Bitdeli Badge")

Project details

Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Files for flask-googlemaps, version 0.1.6
Filename, size File type Python version Upload date Hashes
Filename, size Flask-GoogleMaps-0.1.6.tar.gz (4.7 kB) File type Source Python version None Upload date Hashes View

Supported by

AWS AWS Cloud computing Datadog Datadog Monitoring DigiCert DigiCert EV certificate Facebook / Instagram Facebook / Instagram PSF Sponsor Fastly Fastly CDN Google Google Object Storage and Download Analytics Microsoft Microsoft PSF Sponsor Pingdom Pingdom Monitoring Salesforce Salesforce PSF Sponsor Sentry Sentry Error logging StatusPage StatusPage Status page