AufaHafizah/WebGIS_Project
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add file

Browse Source
This commit is contained in:
AufaHafizah
2026-06-10 19:26:40 +07:00
parent 02c8394972
commit 7e2d324c2e
49 changed files with 6334 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
01/ambil.php
+12
View File
@@ -0,0 +1,12 @@
<?php
include 'koneksi.php';
$data = [];
$result = $conn->query("SELECT * FROM spbu");
while($row = $result->fetch_assoc()){
$data[] = $row;
}
echo json_encode($data);
?>
01/ambildata.php
+13
View File
@@ -0,0 +1,13 @@
<?php
include 'koneksi.php';
$result = $conn->query("SELECT * FROM spbu");
$data = [];
while($row = $result->fetch_assoc()){
$data[] = $row;
}
echo json_encode($data);
?>
01/edit.php
+18
View File
@@ -0,0 +1,18 @@
<?php
include 'koneksi.php';
$id = $_POST['id'];
$nama = $_POST['nama_spbu'];
$wa = $_POST['no_wa'];
$status = $_POST['status'];
$sql = "UPDATE spbu
SET nama_spbu='$nama', no_wa='$wa', status='$status'
WHERE id='$id'";
if($conn->query($sql)){
echo "success";
}else{
echo "error: " . $conn->error;
}
?>
01/hapus.html
+13
View File
@@ -0,0 +1,13 @@
<?php
include 'koneksi.php';
$id = $_POST['id'];
$sql = "DELETE FROM spbu WHERE id='$id'";
if ($conn->query($sql)) {
echo "success";
} else {
echo "error: " . $conn->error;
}
?>
01/index.html
+80
View File
@@ -0,0 +1,80 @@
<!DOCTYPE html>
<html lang="en">
<head>
<base target="_top">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Quick Start - Leaflet</title>
<link rel="shortcut icon" type="image/x-icon" href="docs/images/favicon.ico" />
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY=" crossorigin=""/>
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js" integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=" crossorigin=""></script>
<style>
html, body {
height: 100%;
margin: 0;
}
.leaflet-container {
height: 400px;
width: 600px;
max-width: 100%;
max-height: 100%;
}
</style>
</head>
<body>
<div id="map" style="width: 600px; height: 400px;"></div>
<script>
const map = L.map('map').setView([-0.0552679922693441, 109.34961134769004], 13);
const tiles = L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 19,
attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
}).addTo(map);
const marker = L.marker([-0.0552679922693441, 109.34961134769004]).addTo(map)
.bindPopup('<b>Hello world!</b><br />I am a popup.').openPopup();
const circle = L.circle([-0.056, 109.35], {
color: 'red',
fillColor: '#f03',
fillOpacity: 0.5,
radius: 500
}).addTo(map).bindPopup('I am a circle.');
const polygon = L.polygon([
[-0.054, 109.34],
[-0.057, 109.36],
[-0.052, 109.355]
]).addTo(map).bindPopup('I am a polygon.');
const popup = L.popup()
.setLatLng([51.513, -0.09])
.setContent('I am a standalone popup.')
.openOn(map);
function onMapClick(e) {
popup
.setLatLng(e.latlng)
.setContent(`You clicked the map at ${e.latlng.toString()}`)
.openOn(map);
}
map.on('click', onMapClick);
</script>
</body>
</html>
01/index.php
+197
View File
@@ -0,0 +1,197 @@
<!DOCTYPE html>
<html>
<head>
<title>Peta SPBU</title>
<link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css"/>
<script src="https://unpkg.com/leaflet/dist/leaflet.js"></script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<style>
#map { height: 100vh; }
</style>
</head>
<body>
<div id="map"></div>
<script>
// ================= MAP =================
var map = L.map('map').setView([-0.055353822919599796, 109.3495577035227], 15);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {}).addTo(map);
// ================= ICON =================
var iconHijau = L.icon({
iconUrl: 'https://maps.google.com/mapfiles/ms/icons/green-dot.png',
iconSize: [32,32]
});
var iconMerah = L.icon({
iconUrl: 'https://maps.google.com/mapfiles/ms/icons/red-dot.png',
iconSize: [32,32]
});
// ================= LOAD DATA =================
function loadData(){
$.getJSON("ambil.php", function(data){
data.forEach(function(d){
var icon = (d.status === "yes") ? iconHijau : iconMerah;
var marker = L.marker([d.lat, d.lng], {
icon: icon,
draggable: true
}).addTo(map);
// simpan id di marker
marker.spbu_id = d.id;
// popup edit + hapus
var popup = `
<form onsubmit="updateData(event, ${d.id})">
<b>Edit SPBU</b><br><br>
Nama:<br>
<input type="text" name="nama_spbu" value="${d.nama_spbu}" required><br><br>
WA:<br>
<input type="text" name="no_wa" value="${d.no_wa}" required><br><br>
Status:<br>
<select name="status">
<option value="yes" ${d.status=="yes"?"selected":""}>Yes</option>
<option value="no" ${d.status=="no"?"selected":""}>No</option>
</select><br><br>
<button type="submit">Update</button>
<button type="button" onclick="hapusData(${d.id})">Hapus</button>
</form>
`;
marker.bindPopup(popup);
// drag update koordinat
marker.on('dragend', function(){
var pos = marker.getLatLng();
$.post("update.php", {
id: d.id,
lat: pos.lat,
lng: pos.lng
});
});
});
});
}
loadData();
// ================= TAMBAH DATA =================
map.on('click', function(e){
var form = `
<form id="formSPBU">
<b>Tambah SPBU</b><br><br>
Nama:<br>
<input type="text" name="nama_spbu" required><br><br>
WA:<br>
<input type="text" name="no_wa" required><br><br>
Status:<br>
<select name="status">
<option value="yes">Yes</option>
<option value="no">No</option>
</select><br><br>
<input type="hidden" name="lat" value="${e.latlng.lat}">
<input type="hidden" name="lng" value="${e.latlng.lng}">
<button type="submit">Simpan</button>
</form>
`;
L.popup().setLatLng(e.latlng).setContent(form).openOn(map);
});
// ================= SIMPAN =================
$(document).on('submit','#formSPBU', function(e){
e.preventDefault();
var formData = $(this).serialize();
$.post("simpan.php", formData, function(res){
if(res.trim() === "success"){
alert("✅ Data berhasil disimpan");
map.closePopup();
location.reload(); // biar muncul dengan id
} else {
alert("❌ ERROR: " + res);
}
});
});
// ================= UPDATE DATA =================
function updateData(e, id){
e.preventDefault();
var form = e.target;
var data = $(form).serialize() + "&id=" + id;
$.post("edit.php", data, function(res){
if(res.trim() === "success"){
alert("✅ Data diupdate");
location.reload();
}else{
alert("❌ " + res);
}
});
}
// ================= HAPUS =================
function hapusData(id){
if(confirm("Yakin hapus data ini?")){
$.post("hapus.php", {id:id}, function(res){
if(res.trim() === "success"){
// hapus marker langsung dari map
map.eachLayer(function(layer){
if(layer.spbu_id == id){
map.removeLayer(layer);
}
});
alert("✅ Data dihapus");
} else {
alert("❌ Gagal: " + res);
}
});
}
}
</script>
</body>
</html>
01/koneksi.php
+15
View File
@@ -0,0 +1,15 @@
<?php
$host = getenv('DB_HOST') ?: 'localhost';
$user = getenv('DB_USER') ?: 'root';
$pass = getenv('DB_PASSWORD');
$pass = ($pass === false) ? '' : $pass;
$db = getenv('DB_NAME') ?: 'spbu_db';
$conn = new mysqli($host, $user, $pass, $db);
if ($conn->connect_error) {
die("Koneksi database gagal: " . $conn->connect_error);
}
$conn->set_charset("utf8mb4");
?>
01/simpan.php
+18
View File
@@ -0,0 +1,18 @@
<?php
include 'koneksi.php';
$nama = $_POST['nama_spbu'];
$wa = $_POST['no_wa'];
$status = $_POST['status'];
$lat = $_POST['lat'];
$lng = $_POST['lng'];
$sql = "INSERT INTO spbu (nama_spbu, no_wa, status, lat, lng)
VALUES ('$nama', '$wa', '$status', '$lat', '$lng')";
if ($conn->query($sql)) {
echo "success";
} else {
echo "error: " . $conn->error;
}
?>
01/simpandata.php
+24
View File
@@ -0,0 +1,24 @@
<?php
include 'koneksi.php';
// DEBUG: cek apakah data terkirim
if (!isset($_POST['nama_spbu'])) {
echo "error: data tidak masuk";
exit;
}
$nama = $_POST['nama_spbu'];
$wa = $_POST['no_wa'];
$status = $_POST['status'];
$lat = $_POST['lat'];
$lng = $_POST['lng'];
$sql = "INSERT INTO spbu (nama_spbu, no_wa, status, lat, lng)
VALUES ('$nama', '$wa', '$status', '$lat', '$lng')";
if ($conn->query($sql)) {
echo "success";
} else {
echo "error: " . $conn->error; // 🔥 ini penting
}
?>
01/spbu_db.sql
+77
View File
@@ -0,0 +1,77 @@
-- phpMyAdmin SQL Dump
-- version 5.2.1
-- https://www.phpmyadmin.net/
--
-- Host: 127.0.0.1
-- Generation Time: Jun 07, 2026 at 08:36 AM
-- Server version: 10.4.32-MariaDB
-- PHP Version: 8.2.12
SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO";
START TRANSACTION;
SET time_zone = "+00:00";
/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
/*!40101 SET NAMES utf8mb4 */;
--
-- Database: `spbu_db`
--
CREATE DATABASE IF NOT EXISTS `spbu_db` DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci;
USE `spbu_db`;
-- --------------------------------------------------------
--
-- Table structure for table `spbu`
--
CREATE TABLE `spbu` (
`id` int(11) NOT NULL,
`nama_spbu` varchar(100) NOT NULL,
`no_wa` varchar(20) NOT NULL,
`status` enum('yes','no') NOT NULL,
`lat` double NOT NULL,
`lng` double NOT NULL,
`buka_24jam` enum('yes','no') DEFAULT 'no'
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_general_ci;
--
-- Dumping data for table `spbu`
--
INSERT INTO `spbu` (`id`, `nama_spbu`, `no_wa`, `status`, `lat`, `lng`, `buka_24jam`) VALUES
(1, 'SPBU Wahidin', '12345678', 'yes', -0.05501782621888551, 109.34941275816585, 'no'),
(2, 'SPBU Ayani', '12323534', 'yes', -0.061969576295016156, 109.35348997289081, 'no'),
(3, 'SPBU Wahidin', '12345678', 'yes', -0.05553003299958369, 109.34949398529896, 'no'),
(4, 'SPBU Wahidin', '12345678', 'yes', -0.05518676231453869, 109.34936525640107, 'no'),
(5, 'SPBU Ayani', '12345678', 'no', -0.05385658839135921, 109.35633076365197, 'no');
--
-- Indexes for dumped tables
--
--
-- Indexes for table `spbu`
--
ALTER TABLE `spbu`
ADD PRIMARY KEY (`id`);
--
-- AUTO_INCREMENT for dumped tables
--
--
-- AUTO_INCREMENT for table `spbu`
--
ALTER TABLE `spbu`
MODIFY `id` int(11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT=6;
COMMIT;
/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;
01/update.php
+15
View File
@@ -0,0 +1,15 @@
<?php
include 'koneksi.php';
$id = $_POST['id'];
$lat = $_POST['lat'];
$lng = $_POST['lng'];
$sql = "UPDATE spbu SET lat='$lat', lng='$lng' WHERE id='$id'";
if ($conn->query($sql)) {
echo "success";
} else {
echo "error: " . $conn->error;
}
?>