Tweet
Tweet

Slide 1

Slide 1 text

Maps with GeoDjango PostGIS and Leaflet Paolo Melchiorre & Carmelo Catalfamo Rome - January 21, 2019 Use Case

Slide 2

Slide 2 text

Paolo Melchiorre 2 ● Computer Science Engineer ● Python Developer ~ 2006 ● Django Developer ~ 2011 ● Senior Developer @ 20Tab ● PostgreSQL user (not DBA) ● Remote Worker

Slide 3

Slide 3 text

Carmelo Catalfamo 3 ● JavaScript Developer ● NodeJS developer ~ 2014 ● ReactJS developer ~ 2015 ● React Native developer ● Frontend developer @ 20tab ● Django user

Slide 4

Slide 4 text

Goal 4 ● GeoDjango ● PostGIS ● Leaflet ● Use Case ● Demo ● Conclusion

Slide 5

Slide 5 text

Web mapping 5 ● Map delivered by GIS ● Static and Dynamic ● Interactive and view only ● Raster or Vector tiles ● Spatial databases ● Javascript library

Slide 6

Slide 6 text

GeoDjango 6 ● Geographic framework ● Spatial Field Types ● Spatial ORM queries ● GIS geometry interfaces ● Admin geometry fields ● Many database backends

Slide 7

Slide 7 text

PostGIS 7 ● Best GeoDjango backend ● PostgreSQL extension ● Integrated spatial data ● Spatial data types ● Spatial indexing ● Spatial functions

Slide 8

Slide 8 text

Leaflet 8 ● JavaScript library for maps ● Open Source ● Desktop & Mobile friendly ● Light (~38 KB) ● Well documented ● Simple, preforming, usable

Slide 9

Slide 9 text

Mer et Demeures 1.0 9 ● Python 2.7 ● Django 1.6 ● PostgreSQL 9.3 ● Textual Spatial Fields ● Leaflet 1.0 ● Static/View-only map

Slide 10

Slide 10 text

Mer et Demeures 2.0 10 ● Python 3.6 ● Django 2.1 / GeoDjango ● PostgreSQL 10 ● PostGIS 2.4 / Spatial data ● Leaflet 1.4 ● Dynamic/Interactive map

Slide 11

Slide 11 text

Demo 11 demo.meretdemeures.com

Slide 12

Slide 12 text

Models 12 from django.contrib.gis.db.models import ( MultiPolygonField, PointField) class City(models.Model): # … border = MultiPolygonField() class Ad(models.Model): # … location = PointField()

Slide 13

Slide 13 text

Migrations 13 from django.contrib import postgres from django.db import migrations class Migration(migrations.Migration): dependencies = [('geo', '0001_initial')] operations = [ postgres.operations.CreateExtension( 'postgis' ) ]

Slide 14

Slide 14 text

Managers 14 from django.contrib.gis.geos import Polygon from django.db import models class AdQuerySet(models.QuerySet): def filter_by_bbox(self, bbox): bound_box = Polygon.from_bbox(bbox) return self.filter( location__contained=bound_box )

Slide 15

Slide 15 text

REST API 15 from rest_framework import viewsets from rest_framework_gis import filters class AdViewSet(viewsets.ModelViewSet): # … bbox_filter_field = 'location' filter_backends = [ filters.InBBoxFilter]

Slide 16

Slide 16 text

Admin 16 from django.contrib import gis class AdAdmin(gis.admin.OSMGeoAdmin): # … default_lon = 0 default_lat = 0 default_zoom = 4 map_width = 600 map_height = 400 modifiable = True

Slide 17

Slide 17 text

Ajax/Leaflet JS 17 var map = L.map('map').setView( [lat, lng], zoom ) var tiles = 'https://www.myTiles...' L.tileLayer(tiles).addTo(map) L.marker([51.5, -0.09]).addTo(map)

Slide 18

Slide 18 text

handleMoveend()}> React Leaflet JS 18

Slide 19

Slide 19 text

Conclusion 19 ● Out-of-the-box features ● Spatial & Relational query ● Django/PostgreSQL only ● Backend clusterization ● Administrative levels ● Dynamic spatial entity

Slide 20

Slide 20 text

Acknowledgments 20 Mer et Demeures meretdemeures.com 20tab www.20tab.com

Slide 21

Slide 21 text

Resources 21 ● postgis.net/docs/manual-2.4 ● docs.djangoproject.com/en/2.1/ref/contrib/gis ● leafletjs.com/reference-1.4.0.html ● github.com/django/django ● github.com/postgis/postgis ● github.com/leaflet/leaflet

Slide 22

Slide 22 text

Thank you 22 License (CC BY-SA) creativecommons.org/licenses/by-sa/4.0/ Slide speakerdeck.com/pauloxnet

Slide 23

Slide 23 text

Questions 23 gis.stackexchange.com

Slide 24

Slide 24 text

Contacts Paolo Melchiorre @pauloxnet www.paulox.net Carmelo Catalfamo @mratomicbomb_ www.carmelocatalfamo.it