dropdown masih beberapa geometry belum nampak di map
This commit is contained in:
='fauz
parent
e714218b9d
commit
ea99316d4c
Binary file not shown.
Binary file not shown.
@ -318,7 +318,10 @@ class apiController:
|
||||
) AS virtual_table GROUP BY jenis_pendamping ORDER BY "SUM(jumlah) / COUNT(DISTINCT kabupaten_kota_id)" DESC
|
||||
LIMIT 10000;
|
||||
"""
|
||||
try:
|
||||
cur.execute(SQL)
|
||||
except Exception as e:
|
||||
return []
|
||||
result = cur.fetchall()
|
||||
return result
|
||||
|
||||
@ -371,7 +374,7 @@ class apiController:
|
||||
#======================================================
|
||||
#MAP DATA
|
||||
#=========================================================
|
||||
def fetch_geojson(level, parent_code=None):
|
||||
def fetch_geojson(conn,level, parent_code=None):
|
||||
# cur = conn.cursor()
|
||||
# cur.execute(f"SELECT id, kode, nama, lat, lng, path, iso FROM {table_name} WHERE id = 1 LIMIT 1")
|
||||
cur = conn.cursor()
|
||||
@ -383,7 +386,15 @@ class apiController:
|
||||
elif level == 'kecamatan':
|
||||
cur.execute("SELECT id, kode, nama, null as lat, null as lng, koordinat as path FROM wil_kecamatan WHERE kabupaten_kota_id = %s", (parent_code,))
|
||||
elif level == 'desa':
|
||||
cur.execute("SELECT id, kode, nama, null as lat, null as lng,path FROM wil_desa WHERE kecamatan_id = %s", (parent_code,))
|
||||
# cur.execute("SELECT id, kode, nama, null as lat, null as lng,path FROM wil_desa WHERE kecamatan_id = %s", (parent_code,))
|
||||
cur.execute(("""
|
||||
SELECT id, kode, nama, null as lat, null as lng,
|
||||
CONCAT(
|
||||
REPEAT('[', 4 - (LENGTH(path) - LENGTH(REPLACE(path, '[', '')))),
|
||||
path,
|
||||
REPEAT(']', 4 - (LENGTH(path) - LENGTH(REPLACE(path, ']', ''))))
|
||||
) AS path
|
||||
FROM wil_desa WHERE kecamatan_id = %s""", (parent_code,)))
|
||||
else:
|
||||
return {"type": "FeatureCollection", "features": []}
|
||||
features = []
|
||||
@ -1006,28 +1017,28 @@ class apiController:
|
||||
return result
|
||||
|
||||
@staticmethod
|
||||
def getPendampingPerDesa(conn, kode_desa):
|
||||
cursor = conn.cursor()
|
||||
SQL = """
|
||||
SELECT jenis_pendamping AS jenis_pendamping, sum(jumlah) AS "SUM(jumlah)"
|
||||
FROM (select
|
||||
wp.id provinsi_id, wp.kode provinsi_kode, wp.nama provinsi_nama,
|
||||
wkk.id kabupaten_kota_id, wkk.kode kabupaten_kota_kode, wkk.nama kabupaten_kota_nama,
|
||||
wk.id kecamatan_id, wk.kode kecamatan_kode, wk.nama kecamatan_nama,
|
||||
wkd.id kelurahan_desa_id, wkd.kode kelurahan_desa_kode, wkd.nama kelurahan_desa_nama,
|
||||
mpd.jenis_pendamping, mpd.jumlah
|
||||
from metric_pendamping_desa mpd
|
||||
inner join wil_desa wkd on mpd.kelurahan_desa_id = wkd.id
|
||||
inner join wil_kecamatan wk on wkd.kecamatan_id = wk.id
|
||||
inner join wil_kabupatenkota wkk on wk.kabupatenkota_id = wkk.id
|
||||
inner join wil_provinsi wp on wkk.provinsi_id = wp.id
|
||||
WHERE wkd.kode = %s
|
||||
) AS virtual_table GROUP BY jenis_pendamping ORDER BY "SUM(jumlah)" DESC
|
||||
LIMIT 1000;
|
||||
"""
|
||||
cursor.execute(SQL, (kode_desa,))
|
||||
result = cursor.fetchall()
|
||||
return result
|
||||
# def getPendampingPerDesa(conn, kode_desa):
|
||||
# cursor = conn.cursor()
|
||||
# SQL = """
|
||||
# SELECT jenis_pendamping AS jenis_pendamping, sum(jumlah) AS "SUM(jumlah)"
|
||||
# FROM (select
|
||||
# wp.id provinsi_id, wp.kode provinsi_kode, wp.nama provinsi_nama,
|
||||
# wkk.id kabupaten_kota_id, wkk.kode kabupaten_kota_kode, wkk.nama kabupaten_kota_nama,
|
||||
# wk.id kecamatan_id, wk.kode kecamatan_kode, wk.nama kecamatan_nama,
|
||||
# wkd.id kelurahan_desa_id, wkd.kode kelurahan_desa_kode, wkd.nama kelurahan_desa_nama,
|
||||
# mpd.jenis_pendamping, mpd.jumlah
|
||||
# from metric_pendamping_desa mpd
|
||||
# inner join wil_desa wkd on mpd.kelurahan_desa_id = wkd.id
|
||||
# inner join wil_kecamatan wk on wkd.kecamatan_id = wk.id
|
||||
# inner join wil_kabupatenkota wkk on wk.kabupatenkota_id = wkk.id
|
||||
# inner join wil_provinsi wp on wkk.provinsi_id = wp.id
|
||||
# WHERE wkd.kode = %s
|
||||
# ) AS virtual_table GROUP BY jenis_pendamping ORDER BY "SUM(jumlah)" DESC
|
||||
# LIMIT 1000;
|
||||
# """
|
||||
# cursor.execute(SQL, (kode_desa,))
|
||||
# result = cursor.fetchall()
|
||||
# return result
|
||||
|
||||
@staticmethod
|
||||
def getDesaDenganAtauTanpaKopmerDesa(conn, kode_desa):
|
||||
|
||||
@ -37,7 +37,10 @@ def get_connection():
|
||||
#========================================================
|
||||
@main.route('/')
|
||||
def index():
|
||||
return render_template('index.html')
|
||||
with get_connection() as conn:
|
||||
data = apiController.provinsi(conn)
|
||||
print(data)
|
||||
return render_template('index.html', provinsis=data)
|
||||
|
||||
@main.route("/geojson/provinsi")
|
||||
def get_provinsi():
|
||||
@ -252,12 +255,14 @@ def get_pendamping_per_desa(kode_desa):
|
||||
#informasi bumdes
|
||||
@main.route("/api/desa/bumdes/<kode_desa>")
|
||||
def get_status_bumdes_desa(kode_desa):
|
||||
with get_connection() as conn:
|
||||
data = apiController.getBumdesDesa(conn,kode_desa)
|
||||
return jsonify(data)
|
||||
|
||||
#informasi serapan
|
||||
@main.route("/api/desa/serapan/<kode_desa>")
|
||||
def get_pdesa_serapan(kode_desa):
|
||||
with get_connection() as conn:
|
||||
data = apiController.getTotalSerapanDesa(conn,kode_desa)
|
||||
return jsonify(data)
|
||||
|
||||
|
||||
@ -127,8 +127,9 @@
|
||||
<select class="form-control select2 border border-primary" name="provinsiDropdown" id="provinsiDropdown"
|
||||
data-placeholder="Provinsi ......">
|
||||
<option></option>
|
||||
<option value="1">Option 1</option>
|
||||
<option value="2">Option 2</option>
|
||||
{% for provinsi in provinsis %}
|
||||
<option value="{{provinsi[0]}}">{{provinsi[1]}}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
@ -209,6 +210,10 @@
|
||||
</script>
|
||||
<script>
|
||||
let currentLayer = null;
|
||||
let currentState = {
|
||||
level: null,
|
||||
kode: null
|
||||
};
|
||||
function loadLayer(url, onClickCallback, level = 'provinsi') {
|
||||
currentLevel = level;
|
||||
fetch(url)
|
||||
@ -245,11 +250,9 @@
|
||||
currentLayer = L.geoJSON(data, {
|
||||
style: { color: "blue", weight: 2 },
|
||||
onEachFeature: function (feature, layer) {
|
||||
console.log(feature,layer)
|
||||
let clickTimer = null;
|
||||
layer.on('click', function (e) {
|
||||
layer.on('click', async function (e) {
|
||||
let kode = feature.properties.id;
|
||||
console.log(kode)
|
||||
// onClickCallback(kode);
|
||||
if (clickTimer) {
|
||||
// Double click detected
|
||||
@ -260,11 +263,16 @@
|
||||
let kode = feature.properties.id;
|
||||
onClickCallback(kode);
|
||||
if (url.includes("/provinsi")) {
|
||||
localStorage.setItem('kode_provinsi', feature.properties.kode)
|
||||
const provinsiId = feature.properties.id;
|
||||
localStorage.setItem('kode_provinsi', provinsiId);
|
||||
|
||||
updateDropdown('provinsi',feature.properties.id)
|
||||
} else if (currentLevel === 'kabupatenkota') {
|
||||
localStorage.setItem('kode_kabupatenkota',feature.properties.kode)
|
||||
localStorage.setItem('kode_kabupatenkota',feature.properties.id)
|
||||
updateDropdown('kabupatenkota',feature.properties.id)
|
||||
}else if(currentLevel === 'kecamatan'){
|
||||
localStorage.setItem('kode_kecamatan',feature.properties.kode)
|
||||
localStorage.setItem('kode_kecamatan',feature.properties.id)
|
||||
updateDropdown('kecamatan',feature.properties.id)
|
||||
}
|
||||
} else {
|
||||
// Single click → Tampilkan popup
|
||||
@ -658,13 +666,83 @@
|
||||
|
||||
$('#kecamatanDropdown').on('change', function (e) {
|
||||
const kodeKecamatan = $(this).val();
|
||||
console.log(kodeKecamatan)
|
||||
if (!kodeKecamatan) {
|
||||
console.warn("Kode kecamatan kosong atau null.");
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
localStorage.setItem('kode_kecamatan', kodeKecamatan);
|
||||
loadLayer(`/geojson/desa/${kodeKecamatan}`, () => {}, 'desa');
|
||||
|
||||
loadLayer(`/geojson/desa/${kodeKecamatan}`, () => {
|
||||
console.log("desa dimuat")
|
||||
}, 'desa');
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
<script>
|
||||
function updateDropdown(level, kode) {
|
||||
const dropdownId = {
|
||||
'provinsi': '#provinsiDropdown',
|
||||
'kabupatenkota': '#kabkotaDropdown',
|
||||
'kecamatan': '#kecamatanDropdown'
|
||||
}[level];
|
||||
const nextLevel = {
|
||||
'provinsi': '#provinsiDropdown',
|
||||
'kabupatenkota': '#kabkotaDropdown',
|
||||
'kecamatan': '#kecamatanDropdown'
|
||||
}[level];
|
||||
if ($(dropdownId).length) {
|
||||
$(dropdownId).val(kode).trigger('change.select2');
|
||||
if(level == 'provinsi'){
|
||||
// Ambil kabupaten berdasarkan provinsi
|
||||
const kabkotaURL = "{{ url_for('main.get_master_kabkota') }}";
|
||||
$.ajax({
|
||||
url: kabkotaURL,
|
||||
data: { provinsi_id: $(dropdownId).val() },
|
||||
dataType: 'json',
|
||||
success: function (data) {
|
||||
const results = data.map(kabupaten => ({
|
||||
id: kabupaten[0],
|
||||
text: kabupaten[1]
|
||||
}));
|
||||
|
||||
// Tambahkan ke dropdown kabupaten
|
||||
$('#kabkotaDropdown').select2({
|
||||
data: results,
|
||||
placeholder: 'Pilih Kabupaten/Kota',
|
||||
allowClear: true
|
||||
});
|
||||
}
|
||||
});
|
||||
}else if(level == 'kabupatenkota'){
|
||||
// Ambil kabupaten berdasarkan provinsi
|
||||
const kabkotaURL = "{{ url_for('main.get_master_kecamatan') }}";
|
||||
$.ajax({
|
||||
url: kabkotaURL,
|
||||
data: { kabkota_id: $(dropdownId).val() },
|
||||
dataType: 'json',
|
||||
success: function (data) {
|
||||
const results = data.map(kecamatan => ({
|
||||
id: kecamatan[0],
|
||||
text: kecamatan[1]
|
||||
}));
|
||||
|
||||
// Tambahkan ke dropdown kabupaten
|
||||
$('#kecamatanDropdown').select2({
|
||||
data: results,
|
||||
placeholder: 'Pilih Kecamatan',
|
||||
allowClear: true
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
$(document).ready(function () {
|
||||
console.log("ready for fetching data")
|
||||
const provinsiURL = "{{ url_for('main.get_master_provinsi') }}";
|
||||
@ -672,78 +750,25 @@
|
||||
$('#provinsiDropdown').select2({
|
||||
placeholder: 'Pilih Provinsi',
|
||||
allowClear: true,
|
||||
ajax: {
|
||||
url: provinsiURL,
|
||||
dataType: 'json',
|
||||
delay: 250,
|
||||
data: function (params) {
|
||||
return {
|
||||
q: params.term
|
||||
};
|
||||
},
|
||||
processResults: function (data) {
|
||||
console.log(data)
|
||||
return {
|
||||
results: data.map(provinsi => ({
|
||||
id: provinsi[0],
|
||||
text: provinsi[1]
|
||||
}))
|
||||
};
|
||||
},
|
||||
cache: true
|
||||
},
|
||||
minimumInputLength: 0
|
||||
});
|
||||
|
||||
$('#kabkotaDropdown').select2({
|
||||
placeholder: 'Pilih Kabkota',
|
||||
allowClear: true,
|
||||
ajax: {
|
||||
url: provinsiURL,
|
||||
dataType: 'json',
|
||||
delay: 250,
|
||||
data: function (params) {
|
||||
return {
|
||||
q: params.term
|
||||
};
|
||||
},
|
||||
processResults: function (data) {
|
||||
console.log(data)
|
||||
return {
|
||||
results: data.map(provinsi => ({
|
||||
id: provinsi[0],
|
||||
text: provinsi[1]
|
||||
}))
|
||||
};
|
||||
},
|
||||
cache: true
|
||||
},
|
||||
minimumInputLength: 0
|
||||
});
|
||||
|
||||
$('#provinsiDropdown').select2({
|
||||
placeholder: 'Pilih Desa',
|
||||
allowClear: true,
|
||||
ajax: {
|
||||
url: provinsiURL,
|
||||
dataType: 'json',
|
||||
delay: 250,
|
||||
data: function (params) {
|
||||
return {
|
||||
q: params.term
|
||||
};
|
||||
},
|
||||
processResults: function (data) {
|
||||
console.log(data)
|
||||
return {
|
||||
results: data.map(provinsi => ({
|
||||
id: provinsi[0],
|
||||
text: provinsi[1]
|
||||
}))
|
||||
};
|
||||
},
|
||||
cache: true
|
||||
},
|
||||
//ajax: {
|
||||
// url: '',//provinsiURL,
|
||||
// dataType: 'json',
|
||||
// delay: 250,
|
||||
// data: function (params) {
|
||||
// return {
|
||||
// q: params.term
|
||||
// };
|
||||
// },
|
||||
// processResults: function (data) {
|
||||
// return {
|
||||
// results: data.map(provinsi => ({
|
||||
// id: provinsi[0],
|
||||
// text: provinsi[1]
|
||||
// }))
|
||||
// };
|
||||
// },
|
||||
// cache: true
|
||||
//},
|
||||
minimumInputLength: 0
|
||||
});
|
||||
});
|
||||
@ -769,7 +794,6 @@
|
||||
fetch(url)
|
||||
.then(res => res.json())
|
||||
.then(data => {
|
||||
console.log(data)
|
||||
document.getElementById('tot_sr').textContent = parseDanBulatkanKeMiliar(data['serapan_per_m'])
|
||||
document.getElementById('pr_sr').textContent = data['persentage'] + "%"
|
||||
})
|
||||
|
||||
Loading…
Reference in New Issue
Block a user