GIS - Python Edit1
GIS - Python Edit1
Samsu Arif
Pengantar GIS - Python
Samsu Arif
Software GIS vs GIS-Python
Samsu Arif
Kenapa GIS-Python
Folium - PyQT
Samsu Arif
Kenapa GIS-Python
• SIG bertujuan memudahkan kita dalam mencari informasi terkait suatu lokasi tertentu beserta karakteristiknya.
• Tanpa disadari, kita sudah menggunakan SIG dalam kehidupan sehari-hari.
• Salah satu bentuknya adalah Global Positioning System (GPS) pada smartphone.
• Dengan menggunakan GPS, kamu bisa menggunakan peta elektronik untuk menuju lokasi tertentu.
• Contoh peta elektronik yang biasa digunakan antara lain Google Maps.
• Google Maps adalah contoh yang paling popular penggunaan GIS berbasis jaringan internet.
• Untuk kebutuhan yang lebih kompleks dan luas, ESRI dengan arcgis online.
• Python menjadi semacam bahasa skripting utama dalam menangani tugas-tugas analisis geospasial.
• Bahkan ketika ESRI menghentikan rilis ArcView pada tahun 2002, secara resmi ESRI meninggalkan bahasa skripting
ciptaannya sendiri, yaitu Avenue, dan memutuskan untuk menjadikan Python sebagai bahasa skripting standar pada
generasi aplikasi penerus ArcView, yaitu ArcGIS.
• Demikian juga halnya dengan beberapa aplikasi SIG open source, yang juga menggunakan Python sebagai bahasa
skripting untuk analisis geospasial.
• Salah satunya yang paling populer adalah Quantum GIS.
• Bahkan aplikasi SIG yang diyakini sebagai aplikasi SIG open source yang tertua di dunia, yaitu GRASS, secara
keseluruhan kode programnya ditulis dengan Bahasa Python.
Samsu Arif
Bidang Aplikasi GIS-Python
Samsu Arif
Programming dan Code Editor
Samsu Arif
Python dan Visual Studio Code
https://www.python.org/downloads/windows/ https://code.visualstudio.com/
Samsu Arif
Tools – Visual Studio Code
Samsu Arif
xampp - MySQL
• https://www.apachefriends.org/download.html
Samsu Arif
Instalasi Pendukung
Samsu Arif
Instalasi Virtual Environment
• Virtual environment adalah sebuah ruang lingkup virtual yang terisolasi dari dependencies utama. Virtual
Environment sangat berguna ketika kita membutuhkan dependencies yang berbeda-beda antara projek satu
dengan lainnya yang berjalan pada satu system operasi yang sama
Default Modul
Samsu Arif
Cara Membuat Projek Baru
Samsu Arif
Install Library - Flask
• Flask adalah sebuah web framework yang ditulis dengan bahasa Python dan tergolong sebagai jenis
microframework. Flask berfungsi sebagai kerangka kerja aplikasi dan tampilan dari suatu web. Dengan
menggunakan Flask dan bahasa Python, pengembang dapat membuat sebuah web yang terstruktur dan
dapat mengatur behaviour suatu web dengan lebih mudah.
Samsu Arif
Install Library - folium
• folium adalah sebuah library yang digunakan pada python dengan bertumpu pada leaflet.js. Data
dimanipulasi dengan python lalu di visualisasikan petanya dengan leaflet melalui folium.
Samsu Arif
Proyek Sederhana
Samsu Arif
Apa itu Flask
• Flask merupakan framework mikro yang ditulis menggunakan Python dan berdasar pada
pustaka Werzeug dan Jinja.
• Werzeug adalah pustaka Python yang berfungsi untuk melakukan pemetaan WSGI
• Jinja adalah pustaka yang digunakan untuk membuat halaman web (dalam flask disebut
template).
Samsu Arif
Arsitektur Aplikasi Flask
View (berupa
Model Database
fungsi)
Template
Samsu Arif
Proyek Sederhana Flask
Contoh program minimal dengan flask
D:\gis_python\pertemuan_1\1.Pengantar_gis_python\app.py
Samsu Arif
Proyek Sederhana flask - folium
Contoh program minimal dengan flask - folium
D:\gis_python\pertemuan_1\2.folium_sederhana\app.py
Samsu Arif
Keluaran Proyek Sederhana flask - folium
Contoh program minimal dengan flask - folium
Samsu Arif
Instalasi Library
1. Library
2. Cara Instalasi Library
Samsu Arif
Library
Samsu Arif
Cara Instalasi Library
Samsu Arif
Outline
• Pengantar Template
• Menangani Beberapa Template
• Mengirim Parameter ke Template
• Template Engine dengan Jinja2
• Struktur Template
• Link dan Button
Samsu Arif
Pengantar Template
Contoh program minimal dengan flask - folium
D:\gis_python\pertemuan_1\2.folium_sederhana\app.py
Samsu Arif
Pengantar Template
{% extends "layout.html" %}
Layout.html indeks.html
{% include "map.html" %}
map.html
template
folium_map.save('templates/map.html')
Samsu Arif
Pengantar Template
Contoh program minimal flask – folium dengan template
D:\gis_python\pertemuan_2\1.template_dasar\app.py
https://localhost:5000
https://localhost:5000/jinja2_folium
D:\gis_python\pertemuan_2\2.multitemplate\app.py
Samsu Arif
Mengirim Parameter ke Template
Variabel dapat dikirim dari konteks Flask ke template yang dirender melalui parameter template
D:\gis_python\pertemuan_2\3.mengirim_paramter_ke_template\multi_template.py
D:\gis_python\pertemuan_2\3.mengirim_paramter_ke_template\templates\index.html
Samsu Arif
Template Engine dengan Template2
1. Jinja2
2. Penggunaan Template Engine dengan Jinja2
3. Link dan Button
Samsu Arif
Jinja2
• comment_start_string : String yang menandai awal untuk mencetak komentar -> '{#'.
• comment_end_string : String yang menandai akhir untuk mencetak komentar -> '#}'.
Samsu Arif
Struktur Template
Index.html
layout.html
Samsu Arif
Template Engine dengan Jinja2
{% if objectA is objectB %}
{% if objectA is not none %}
Samsu Arif
Penggunaan Template Engine dengan Jinja2
D:\gis_python\pertemuan_2\4.engine_jinja2\engine_jinja2.py
D:\gis_python\pertemuan_2\4.engine_jinja2\templates\index.html
Samsu Arif
Template Engine dengan Jinja2
Samsu Arif
Link dan Button
D:\gis_python\pertemuan_2\6.link_dan_button\templates\index.html
D:\gis_python\pertemuan_2\6.link_dan_button\templates\peta.html
D:\gis_python\pertemuan_2\6.link_dan_button\link_button.py
Samsu Arif
Outline
• Download Bootstrap - JS
• Menu - Navbar
• Menu – Navbar Dropdown
• URL Converter
• HTTP Method
• Flash Message
• Form dan Input Data
• WTForm
Samsu Arif
Download Bootstrap
https://getbootstrap.com/docs/5.1/getting-started/download/
https://popper.js.org/
D:\gis_python\pertemuan_3\1.bootstrap_dan_jquery\static\js\popper.min.js
Samsu Arif
Menu - Navbar
https://www.w3schools.com/bootstrap5/bootstrap_navbar.php
Samsu Arif
Menu - Navbar
D:\gis_python\pertemuan_3\1.bootstrap_dan_jquery\templates\_layout.html
Samsu Arif
Menu – Navbar Dropdown
https://www.w3schools.com/bootstrap5/bootstrap_navbar.php
Samsu Arif
Menu – Navbar Dropdown
D:\gis_python\pertemuan_3\2.menu_navbar\templates\_layout.html
Samsu Arif
URL Converter
Di dalam @app.route(), dapat ditambakan variable ke URL yang dituju dengan bentuk
penulisan <nama_variable>.
Fungsi yang ada di bawah routing kemudian menerima <nama_variable> sebagai kata kunci
argument.
Jenis argument yang diterima secara devault dikenal sebagai string, untuk tipe data spesifik
argument dapat diatur sebagai: integer, float (<int:id>, <float:lokasi>)
http://localhost:5000/zoom/11
http://localhost:5000/koordinat_tengah/-5.1543/119.437
D:\gis_python\pertemuan_3\3.URL_converter\app.py
Samsu Arif
URL Converter
D:\gis_python\pertemuan_3\3.URL_converter\app.py
http://localhost:5000/html_folium/Universitas Hasanuddin
Samsu Arif
HTTP Method
http://localhost:5000/user
Samsu Arif
Flash Message
• Flash message membantu kita memberikan beberapa pesan umpan balik dari server ke browser web.
• Pesannya dapat berupa pesan sukses, atau memberi tahu jika ada yang tidak beres.
• Untuk mengaktifkan pesan flash di aplikasi, letakkan di bawah template Jinja2 agar dapat memperoleh
dan menampilkan pesan flash di dalam _layout.html
D:\gis_python\pertemuan_3\5.flash_message\templates\_layout.html
Samsu Arif
Flash Message
• Di dalam fungsi rute, kita dapat memanggil pesan flash dengan sintaks flash(“pesan”, “tipe”)
• Tipe dapat berupa:
• success
• danger
• info
• dll (sesuai dengan color class di Bootstrap)
Samsu Arif
Flash Message
Samsu Arif
Form dan Input Data
Form Input
Nama
Nomor Telpon
Password
Password Lagi
Setuju
Submit
Submit
Samsu Arif
WTForm
• WTForms adalah perpustakaan validasi dan rendering formulir yang fleksibel untuk pengembangan web Python
• Mendukung validasi data, perlindungan CSRF, internasionalisasi (I18N), dan banyak lagi.
• Bagaimana cara memasukkan Flask WTForm ke dalam aplikasi kita?
• Untuk kasus sederhana, tempatkan definisi formulir di dalam forms.py
/templates
app.py
form.py
Samsu Arif
WTForm
• Buat class UserForm() di dalam file form.py, dengan field: nama, email, telpon, password, confirm, setuju dan
submit
• class UserForm() diwarisi (inherited) dari class Form WTForm
• Di dalam class itu kita bisa meletakkan form field seperti StringField (Input Text), PasswordField (Password
Input), BooleanField (Checkbox Input) dan SubmitField (tombol Submit)
• Penggunaan objek validators yang dapat membantu melakukan validasi data seperti panjang input data, field
yang dibutuhkan, dan lain-lain.
app.py
form.py
• Selanjutnya buat objek form dari class UserForm, dan ambil nilai dari form dengan request.form
D:\gis_python\pertemuan_3\6.WTForm\app.py
Samsu Arif
WTForm
• Atur letak dari elemen form yang disimpan dalam file “_form_macro.html” (dapat diberi nama lain)
• Copy macro dari alamat: http://matrix.umcs.lublin.pl/DOC/python-flask-doc/html/patterns/wtforms.html
D:\gis_python\pertemuan_3\6.WTForm\templates\_form_macro.html
Samsu Arif
WTForm
• Kemudian kita dapat merender formulir menggunakan macro render_field() di dalam file “_form_macro.html”
D:\gis_python\pertemuan_3\6.WTForm\templates\user.html
• Jika kita memiliki banyak bentuk, mekanisme ini jauh lebih bersih dan
mudah dirawat jika spesifikasi bentuk (gaya, dll) berubah.
• Di bagian selanjutnya kita akan belajar bagaimana menambahkan kelas
Bootstrap di dalam bidang yang dirender.
Samsu Arif
WTForm
app.py
User.html render_field(form.nama)
_form_macro.
html
Samsu Arif
Outline
• Pengenalan Database
• Konfigurasi SQL-Alchemy
• Model Relasi SQL-Alchemy
• Insert dan Select
• User Form
• Tabel
• Pagination
Samsu Arif
Pengenalan Database
Samsu Arif
Apa itu Database
https://corporatefinanceinstitute.com/resources/knowledge/data-analysis/database/
Samsu Arif
Database Management System
Samsu Arif
Relational Database
Samsu Arif
Cara Kerja DBMS
HTML
document
CF Server
Samsu Arif
Database Client
Samsu Arif
Database File
RAM
• Mayoritas DBMS menyimpan datanya di file, walaupun ada
beberapa database yang hanya menyimpan datanya di
memory (RAM)
DBMS Data • Database File akan di optimasi oleh DBMS agar
Insert mempermudah DBMS dalam manajemen datanya, seperti
insert, update, delete dan select
update • Tiap DBMS biasanya memiliki cara masing-masing mengelola
File Database File nya, dan kita tidak perlu harus tau, karena yang
delete kita perlu tahu hanya cara berkomunikasi ke DBMS
select
Samsu Arif
Structures Query Language (SQL)
Samsu Arif
MySQL
Kelebihan MySQL:
• Mendukung Integrasi Dengan Bahasa Pemrograman Lain
• Tidak Membutuhkan RAM Besar
• Mendukung Multi User
• Bersifat Open Source
• Struktur Tabel yang Fleksibel
• Tipe Data yang Bervariasi
• Keamanan yang Terjamin
Samsu Arif
Model Database - Flask
1. phpyadmin
2. Buat database di phpmyadmin
3. ORM menggunakan Flask - SQL Alchemy
4. Konfigurasi Flask - SQL Alchemy
5. Penggunaan SQLToolMySQL VS Code Extension
Samsu Arif
phpmyadmin
http://localhost/phpmyadmin/
Samsu Arif
Buat Database di phpmyadmin
Samsu Arif
ORM Menggunakan Flask - SQL Alchemy
• Object–relational mapping (ORM, O/RM, and O/R mapping tool) dalam ilmu komputer adalah teknik
pemrograman untuk mengubah data antara sistem tipe yang tidak kompatibel menggunakan bahasa
pemrograman berorientasi objek (Wikipedia).
Kelebihan ORM
• Mudah diakses dan dipelihara
• Lebih aman dari hacker injeksi
• Memperbaiki format SQL
• Menggunakan OOP (kemampuan untuk
memperluas & mewarisi Model)
• SQLAlchemy merupakan sekumpulan perangkat lunak dengan sumber terbuka untuk SQL dan
Pemetaan Objek Relasional (object-relational mapper disingkat dengan ORM) untuk bahasa
pemrograman Python (Wikipedia)
Samsu Arif
Konfigurasi Flask - SQL Alchemy
• Flask-SQLAlchemy adalah ekstensi untuk Flask yang menambahkan dukungan untuk SQLAlchemy ke aplikasi yang
dibuat.
• Bertujuan untuk menyederhanakan penggunaan SQLAlchemy dengan Flask dengan menyediakan default yang
berguna dan pembantu tambahan yang membuatnya lebih mudah untuk menyelesaikan tugas-tugas umum. [Flask-
SQLAlchemy]
D:\gis_python\pertemuan_4\1.orm\config.py
D:\gis_python\pertemuan_4\1.orm\app.py
D:\gis_python\pertemuan_4\1.orm\model.py
Samsu Arif
Konfigurasi Flask - SQL Alchemy
D:\gis_python\pertemuan_4\1.orm\config.py
• Kita bisa meletakkan semua konfigurasi Flask di dalam file ini, tidak hanya
untuk koneksi database.
D:\gis_python\pertemuan_4\1.orm\app.py
Samsu Arif
Konfigurasi Flask - SQL Alchemy
D:\gis_python\pertemuan_4\1.orm\model.py
D:\gis_python\pertemuan_4\1.orm\app.py
• Bagian yang penting adalah, kita perlu mengimpor objek db di atas ke app.py.
• setelah itu kita dapat menggunakan db.init_app(app) untuk melampirkan
objek db ke dalam konteks aplikasi Flask.
• Setelah itu kita langsung saja (untuk kasus ini) langsung saja menggunakan
db.create_all() untuk membuat Database yang sudah didefinisikan
sebelumnya di dalam model.py
• Tujuan app.app_context() adalah untuk mendorong konteks aplikasi saat
membuat tabel, kita perlu melakukan ini karena bagian ini berada di luar
tampilan/rute kita
Samsu Arif
Penggunaan SQLTools MySQL di VS Code
Samsu Arif
Penggunaan SQLTools MySQL di VS Code
Samsu Arif
Penggunaan SQLTools MySQL di VS Code
show
Samsu Arif
Relasi Database
• Buat Data Model baru bernama Alamat dan tambahkan ForeignKey userId dengan menentukan
db.ForeignKey(‘user.id’) dengan tipe Integer
D:\gis_python\pertemuan_4\2.relasi_database\model.py
Samsu Arif
Insert Data
D:\gis_python\pertemuan_4\3.insert_data\app.py
• Untuk insert data ke User kita perlu membuat objek yang
diturunkan dari class User dengan nilai variabel yang
ditentukan.
• Gunakan db.session.add(object) akan mengeluarkan
pernyataan INSERT ke dalam database.
• Kemudian db.session.commit() akan membuat data yang
disisipkan berada di database.
Samsu Arif
Insert Data
• Ketika mengakses data, akan diperoleh kembali objek query baru di semua record.
• Untuk memfilter record dapat digunakan metode filter() dan filter_by().
• Sebelum diaktifkan pilih dengan all() atau first().
• Jika ingin menggunakan primery_key, dapat menggunakan get()
• Kita dapat mengorder data menggunakan order_by()
• Untuk membatasi jumlah record digunakan limit()
https://docs.sqlalchemy.org/en/14/orm/query.html#sqlalchemy.orm.Query
Samsu Arif
Select (Query) Data
D:\gis_python\pertemuan_4\4.select_data\app.py
Samsu Arif
Select (Query) Data
Samsu Arif
Update Data
Samsu Arif
Outline
• JSON
• Geojson
• Konversi Shape file ke GeoJSON
• GeoJSON ke Shapefile
Samsu Arif
Apa itu JSON
• JSON (JavaScript Object Notation) adalah format pertukaran data yang ringan, mudah
dibaca dan ditulis oleh manusia, serta mudah diterjemahkan dan dibuat (generate)
oleh komputer. Format ini dibuat berdasarkan bagian dari Bahasa Pemprograman
JavaScript.
https://www.json.org/json-id.html
• JSON merupakan format teks yang tidak bergantung pada bahasa
pemprograman apapun karena menggunakan gaya bahasa yang umum
digunakan oleh programmer.
• Oleh karena sifat-sifat tersebut, menjadikan JSON ideal sebagai bahasa
pertukaran-data
'{"name":"John", "age":30, "car":null}‘
Samsu Arif
Apa itu GeoJSON
Id feature
format data
Koordinat
Id Label
Label
Samsu Arif
GeoJSON - Multiline
https://jsoneditor
online.org/#right=
local.suduli&left=l
ocal.fukozi
Samsu Arif
GeoJSON - Multipolygon
https://jsoneditoronline.
org/#right=local.suduli&l
eft=local.fukozi
Samsu Arif
Konversi Shp ke GeoJSON dengan ArcMap
Samsu Arif
Menampilkan Peta GeoJSON di Flask
Samsu Arif