diff --git a/Web GIS Rumah Ibadah/index.html b/Web GIS Rumah Ibadah/index.html index 0e65e62..5effb31 100644 --- a/Web GIS Rumah Ibadah/index.html +++ b/Web GIS Rumah Ibadah/index.html @@ -685,9 +685,9 @@
Demo Akun
-
Admin: admin / admin123
-
Walikota: walikota / admin123
-
Pengurus: RI-MSJ-4821 / pengurus123
+
Admin: admin
+
Walikota: walikota
+
Pengurus: RI-MSJ-4821
diff --git a/index.php b/index.php index de86c0e..d724244 100644 --- a/index.php +++ b/index.php @@ -1,12 +1,16 @@ + @@ -17,31 +21,39 @@ + -
- -
+
+ +
- - - - -
-
-
- - Sistem Informasi Geografis -
-

- Portal WebGIS
Kota Pontianak -

-

- Pusat akses seluruh project Sistem Informasi Geografis berbasis web untuk pengelolaan data spasial wilayah Kota Pontianak. -

-
-
-
2
-
Project Aktif
+ +
+ - -
-
-
-
Daftar Project
-

Semua WebGIS Project

+ +
+
+
+ + Sistem Informasi Geografis +
+

+ Portal WebGIS
Kota Pontianak +

+

+ Pusat akses seluruh project Sistem Informasi Geografis berbasis web untuk pengelolaan data spasial wilayah Kota Pontianak. +

+
+
+
2
+
Project Aktif
+
+
+
6+
+
Layer Data
+
+
+
PHP
+
+
+
+
GIS
+
LeafletJS
+
+
+
-
- - -
- 01 -
- -
- -
- - Jalan - - - Parsil - - - SPBU - -
- -

WebGIS Layer — Jalan, Parsil & SPBU

-

- Sistem informasi geografis untuk manajemen data jalan (nasional, provinsi, kabupaten), parsil tanah beserta status kepemilikan, dan sebaran SPBU di Kota Pontianak. -

- -
-
- - Gambar polyline & polygon langsung di peta -
-
- - CRUD data jalan, parsil tanah & SPBU -
-
- - Kalkulasi panjang & luas otomatis (LeafletJS) -
-
- - Layer switcher: Street & Satellite view -
-
- -
-
- - /Web GIS Layer/ -
- - Buka Project - -
+ +
+
+
+
Daftar Project
+

Semua WebGIS Project

- -
- 02 -
- -
+
-
- - Kemiskinan - - - Rumah Ibadah - - - Bantuan - -
+ +
+ 01 +
+ +
-

WebGIS Poverty Mapping & Rumah Ibadah

-

- Pemetaan keluarga miskin, histori penyaluran bantuan sosial, dan lokasi rumah ibadah berbasis peta interaktif. Dilengkapi dashboard analitik dan laporan spasial. -

+
+ + Jalan + + + Parsil + + + SPBU + +
-
-
- - Pemetaan & manajemen data keluarga miskin +

WebGIS Layer — Jalan, Parsil & SPBU

+

+ Sistem informasi geografis untuk manajemen data jalan (nasional, provinsi, kabupaten), parsil tanah beserta status kepemilikan, dan sebaran SPBU di Kota Pontianak. +

+ +
+
+ + Gambar polyline & polygon langsung di peta +
+
+ + CRUD data jalan, parsil tanah & SPBU +
+
+ + Kalkulasi panjang & luas otomatis (LeafletJS) +
+
+ + Layer switcher: Street & Satellite view +
-
- - Histori & tracking bantuan sosial -
-
- - Lokasi rumah ibadah (masjid, gereja, dll.) -
-
- - Dashboard statistik & laporan lengkap + +
+
+ + /Web GIS Layer/ +
+ + Buka Project +
-
-
- - /Web GIS Rumah Ibadah/ + +
+ 02 +
+
- - Buka Project - + +
+ + Kemiskinan + + + Rumah Ibadah + + + Bantuan + +
+ +

WebGIS Poverty Mapping & Rumah Ibadah

+

+ Pemetaan keluarga miskin, histori penyaluran bantuan sosial, dan lokasi rumah ibadah berbasis peta interaktif. Dilengkapi dashboard analitik dan laporan spasial. +

+ +
+
+ + Pemetaan & manajemen data keluarga miskin +
+
+ + Histori & tracking bantuan sosial +
+
+ + Lokasi rumah ibadah (masjid, gereja, dll.) +
+
+ + Dashboard statistik & laporan lengkap +
+
+ +
+
+ + /Web GIS Rumah Ibadah/ +
+ + Buka Project + +
+
+ +
+ + +
+
Teknologi
+

Tech Stack yang Digunakan

+
+
HTML5 & CSS3
+
JavaScript
+
PHP
+
MySQL / MariaDB
+
Leaflet.js 1.9.4
+
Leaflet.Draw
+
Leaflet.GeometryUtil
+
OpenStreetMap
+
Esri Satellite
+
Font Awesome 6
+
Laragon
+
GeoJSON Format
+
+
+ +
+
+ + +
+
+
+ + WebGIS Portal — Kota Pontianak +
+ Dibangun dengan ♥ menggunakan LeafletJS & PHP
+
-
+ + /* ── SCROLL PROGRESS ──────────────────────────────────── */ + window.addEventListener('scroll', () => { + const st = document.documentElement.scrollTop; + const sh = document.documentElement.scrollHeight - document.documentElement.clientHeight; + document.getElementById('scroll-bar').style.width = (st / sh * 100) + '%'; + }); + + /* ── CARD TILT ────────────────────────────────────────── */ + document.querySelectorAll('.project-card').forEach(card => { + card.addEventListener('mousemove', e => { + const r = card.getBoundingClientRect(); + const x = ((e.clientX - r.left) / r.width - 0.5) * 8; + const y = ((e.clientY - r.top) / r.height - 0.5) * 8; + card.style.transform = `translateY(-6px) rotateX(${-y}deg) rotateY(${x}deg)`; + }); + card.addEventListener('mouseleave', () => { + card.style.transform = ''; + }); + }); + + /* ── INTERSECTION OBSERVER ────────────────────────────── */ + const obs = new IntersectionObserver(entries => { + entries.forEach(e => { + if (e.isIntersecting) e.target.style.animationPlayState = 'running'; + }); + }, { + threshold: 0.1 + }); + document.querySelectorAll('.project-card,.tech-chip').forEach(el => { + el.style.animationPlayState = 'paused'; + obs.observe(el); + }); + + \ No newline at end of file