Django Map-Location Field
Project description
Django: Map-Location
Adds a fully-static location field (Leaflet) to manage location-based data without the need for a full-fledged GeoDjango installation. ... when all you need is a visual position chooser.
Features:
- Click on map or drag&drop pin to select location
- Reset button & use map-center button
- Display selected location or map center coordinates with zoom level
Install
- Add to your INSTALLED_APPS
INSTALLED_APPS = [
...,
'map_location',
]
- Create Map-Location field
from map_location.fields import LocationField
class Place(models.Model):
location = LocationField('Pos', blank=True, null=True, options={
'map': {
'center': [52.52, 13.40],
'zoom': 12,
},
# 'markerZoom': 18
# 'tileLayer': 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
# 'tileOptions': {
# attribution: '© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>',
# },
# 'locate': {
# 'showPopup': False,
# },
})
Options Paramter
Key | Info |
---|---|
map | Map Options (default: {center: [20, -25], zoom: 2} ) |
markerZoom | Initial zoom scale (on load) – if a marker is set. (default: 18 ) |
tileLayer | TileLayer urlTemplate (default: "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" ) |
tileOptions | TileLayer Options (default: {} ) |
locate | Leaflet.Locate Options (default: {showPopup: false} ) |
Usage
You can access the location by its parts (place.location.lat
& place.location.long
) or by its string value (str(place.location)
or just place.location
) which will return a comma-separated string (lat,long
). This string format is also used for database storage (with a precision of 6 digits, or up to 11 cm).
Example
If you export your location as json, you can use a fully static map:
_JSON_ = {'loc': [place.location.lat, place.location.long]}
<script src="/static/leaflet/leaflet.js"></script>
<script src="/static/leaflet/locate/L.Control.Locate.min.js"></script>
<link rel="stylesheet" href="/static/leaflet/leaflet.css" />
<link rel="stylesheet" href="/static/leaflet/locate/L.Control.Locate.css" />
...
<div id="map-id"></div>
...
<script>
const osm = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png');
const map = L.map('map-id', {
layers: [osm],
center: [52.52, 13.40],
zoom: 14,
});
L.control.locate({
returnToPrevBounds: true,
showPopup: false,
}).addTo(map);
L.marker(L.latLng(_JSON_.loc)).addTo(map);
...
</script>
See Leaflet docs for configuration options.
License
This project is licensed under MIT and includes:
- v1.9.4 Leaflet (BSD 2-Clause License)
- v0.81.1 Leaflet.Locate (MIT)
Project details
Release history Release notifications | RSS feed
Download files
Download the file for your platform. If you're not sure which to choose, learn more about installing packages.
Source Distribution
Built Distribution
Hashes for django-map-location-0.9.2.tar.gz
Algorithm | Hash digest | |
---|---|---|
SHA256 | 30dbb846541d93a022fb62c34df1a733e3cde8df21a3ade05894d158e1a9a256 |
|
MD5 | 9dc47597138f0184b669409af6ec2734 |
|
BLAKE2b-256 | 3cfe4326425dd755edef572c1ab6913f51decf4eb3ec30d9499af0fe03e6127e |
Hashes for django_map_location-0.9.2-py3-none-any.whl
Algorithm | Hash digest | |
---|---|---|
SHA256 | 64b36b589085814756c4e712de4a85661978e76fb318d41c74364f5f62f97559 |
|
MD5 | 36d3c5eccd56ed7bff069c4dffc23581 |
|
BLAKE2b-256 | d919830dfa32e4ccdc52f6ecce1714477801cf76f403270ab2f40169e33071bc |