37
FREE OPEN SOURCE SOFTWARE FOR GEOSPATIAL (FOSS4G) TALKS AND DEMOS 2 ND PHILIPPINE GEOMATICS SYMPOSIUM 1 CHARMYNE BUENVIAJE MAMADOR

2d web mapping with flask

Embed Size (px)

DESCRIPTION

An intro presentation on making your own web mapping application using basic knowledge in html, css, jquery (Leaflet.js), and python using Flask microframework.

Citation preview

Page 1: 2d web mapping with flask

FREE OPEN SOURCE SOFTWARE FOR GEOSPATIAL (FOSS4G) TALKS AND DEMOS

2ND PHILIPPINE GEOMATICS SYMPOSIUM

1

CHARMYNE BUENVIAJE MAMADOR

Page 2: 2d web mapping with flask

Outline

2

Page 3: 2d web mapping with flask

Web Mapping3

Page 4: 2d web mapping with flask

Web Mapping

4

Page 5: 2d web mapping with flask

5

Page 6: 2d web mapping with flask

Why Web Mapping?6

Page 7: 2d web mapping with flask

7

Page 8: 2d web mapping with flask

8

Page 9: 2d web mapping with flask

9

Page 10: 2d web mapping with flask

Creating Web Maps• WEB SERVICES“a program is used to dispense or take info on the web”

10

Page 11: 2d web mapping with flask

Creating Web Maps• WEB FRAMEWORKS“supports web applications through the use of computer languages”

11

Page 12: 2d web mapping with flask

Web Frameworks

print ‘Hello World!’

12

Page 13: 2d web mapping with flask

13

Page 14: 2d web mapping with flask

Advantages of Web Frameworks

• Efficiency• Security• Cost• Support• Flexibility and Customizability

14

Page 15: 2d web mapping with flask

Kinds of Web Frameworks

FULL STACK

BASIC STACK

15

Page 16: 2d web mapping with flask

Language for frameworks

16

Page 17: 2d web mapping with flask

Readabilityif grade >= 60:

print “Pasado!”else:

print “See you next sem!”

http://www.python.org/dev/peps/pep-0008/

17

Page 18: 2d web mapping with flask

Simple Syntax

Variety of Libraries and Packages• Libraries - Many were already built in.• http://docs.python.org/2/library/index.html

• Packages – 37091 packages and counting.• https://pypi.python.org/pypi

18

Page 19: 2d web mapping with flask

POWERFUL

Documentedhttp://www.python.org/doc/

19

Page 20: 2d web mapping with flask

https://wiki.python.org/moin/WebFrameworks

20

Page 21: 2d web mapping with flask

FLASK21

Page 22: 2d web mapping with flask

What is Flask?

22

Page 23: 2d web mapping with flask

• Created by Armin Ronacher

23

Page 24: 2d web mapping with flask

Microframework

24

Page 25: 2d web mapping with flask

25

Page 26: 2d web mapping with flask

“Jinja2 is a modern and designer friendly templating language for Python.”

jinja.pocoo.org

26

Page 27: 2d web mapping with flask

Templating… …involves the presentation of information in a form which is

often (but not always) intended to be readable, even attractive, to a

human audience. (https://wiki.python.org/moin/Templating)

27

Page 28: 2d web mapping with flask

“a simple collection of various utilities for WSGI applications

and has become one of the most advanced WSGI utility modules.”

28

Page 29: 2d web mapping with flask

Advantages of Flask• Simple • Smaller Scale •A good introduction to web

frameworks• Easier deployment and

development

29

Page 30: 2d web mapping with flask

Webmapping in Flask( oh yeah! We’re almost there! )

30

Page 31: 2d web mapping with flask

The Recipe

31

Page 32: 2d web mapping with flask

32

Page 33: 2d web mapping with flask

File Structure

33

Page 34: 2d web mapping with flask

Flask Extensions

http://flask.pocoo.org/extensions/

34

Page 35: 2d web mapping with flask

leaflet : http://farm9.staticflickr.com/8032/8033050281_a8b4969d88_b.jpgyolanda map : http://google.org/crisismap/a/gmail.com/TyphoonYolandaadvantages of web Mapping : https://sites.google.com/site/mapmakerpedia/maps-101/web-mappinginteraksyon : http://mmdatraffic.interaksyon.com/map-view-edsa.phpnoah: http://noah.dost.gov.ph/CODEigniter : http://php.quicoto.com/wp-content/uploads/2013/07/codeigniter-logo.pngweb : http://files.myopera.com/barriocreaaiep/albums/3389982/WEB.pngPYTHON LOGO: http://slicer.org/slicerWiki/images/3/31/Python-logo.pngRECYCLE IMAGE: http://www.tamborinedailystar.com/Portals/0/tdsPhotos/2010.11.15/recycleArrows_MC910216333.PNGgoogle logo : http://www.seomofo.com/downloads/new-google-logo-knockoff.pngyahoo logo: http://davidbcalhoun.com/present/css3/pix/yahoo_logo.pngnasa logo : http://radiofreethinker.files.wordpress.com/2012/03/nasa_logo.gifjinja2 logo: http://www.viur.is/static/images/jinja2.pngwerkzeug logo: http://www.pocoo.org/_images/werkzeug-logo.pngspiderweb : http://dark.pozadia.org/images/wallpapers/6-1024x768-272625.jpegdora's bag : http://th01.deviantart.net/fs71/PRE/i/2012/130/a/c/the_backpack_from_dora_the_explorer_by_shadowh511-d4zawjc.png

35

Page 36: 2d web mapping with flask

Audrey Roy. “Python tricks you can’t live without”. PYCON PHILIPPINES 2012

Igor Davydenko. “In Flask we trust”. PyCon UA 2012

http://flask.pocoo.org/

36

Disclaimer:All the images here were awesome and were not mine. The images were used to ease understanding and help the audience appreciate the presentation more. Sharing is cool!

Page 37: 2d web mapping with flask

37

Thank you!

Charmyne Buenviaje [email protected]