Johanolisamping/TUGAS_SIG_JOHANESSATRIACHRISTIO
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: Johanolisamping/TUGAS_SIG_JOHANESSATRIACHRISTIO:8b9dc463a8860009456b1767a6ae448fac0295c5
Branches Tags
Johanolisamping/TUGAS_SIG_JOHANESSATRIACHRISTIO:main
...
compare: Johanolisamping/TUGAS_SIG_JOHANESSATRIACHRISTIO:43e99a0f546177c4648644dd50cafc70fdbf2ca3
Branches Tags
Johanolisamping/TUGAS_SIG_JOHANESSATRIACHRISTIO:main

2 Commits
8b9dc463a8 ... 43e99a0f54

Author SHA1 Message Date
Johanolisamping 43e99a0f54 update 2026-06-14 20:16:21 +07:00
Johanolisamping 94d54d9521 Buang setelan MySQL Co-Pilot, pakai SQLite murni 2026-06-11 22:52:30 +07:00
1 changed files with 50 additions and 56 deletions
Expand all files Collapse all files
Projek SPBU 24 JAM/index.php
+49 -55
View File
@@ -1,34 +1,3 @@
<?php
// TAMPILKAN ERROR JIKA ADA YANG SALAH
ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);
// 1. KONEKSI KE DATABASE MySQL
$host = "localhost";
$username = "root";
$password = "";
$database = "webgis_spbu";
$conn = mysqli_connect($host, $username, $password, $database);
if (!$conn) {
die("Koneksi ke database gagal: " . mysqli_connect_error());
}
// 2. QUERY AMBIL DATA SPBU
$query = mysqli_query($conn, "SELECT * FROM t_spbu");
if (!$query) {
die("Query Error: " . mysqli_error($conn));
}
$data_spbu = [];
while ($row = mysqli_fetch_assoc($query)) {
$data_spbu[] = $row;
}
?>
<!DOCTYPE html> <!DOCTYPE html>
<html lang="id"> <html lang="id">
<head> <head>
@@ -65,10 +34,12 @@ while ($row = mysqli_fetch_assoc($query)) {
border-radius: 50%; border-radius: 50%;
} }
</style> </style>
<!-- SPBU PAGE FIXED: USE API FETCH FROM api/get_points.php -->
</head> </head>
<body> <body>
<div id="map"></div> <div id="map"></div>
<div id="spbu-status" style="position: fixed; bottom: 16px; right: 16px; z-index: 9999; background: rgba(255,255,255,0.9); color: #111; padding: 8px 12px; border-radius: 12px; box-shadow: 0 8px 30px rgba(0,0,0,0.1); font-size: 13px; font-weight: 600;">SPBU mode: API fetch</div>
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script> <script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
@@ -85,36 +56,59 @@ while ($row = mysqli_fetch_assoc($query)) {
var layerSpbu24Jam = L.layerGroup().addTo(map); var layerSpbu24Jam = L.layerGroup().addTo(map);
var layerSpbuReguler = L.layerGroup().addTo(map); var layerSpbuReguler = L.layerGroup().addTo(map);
// Konversi data array PHP ke JSON JavaScript function renderSpbuMarkers(markers) {
var dataSpbuDariDatabase = <?php echo json_encode($data_spbu); ?>; markers.forEach(function(spbu) {
var lat = parseFloat(spbu.latitude);
var lng = parseFloat(spbu.longitude);
if (isNaN(lat) || isNaN(lng)) {
return;
}
var isOpen24 = spbu.open_24_hours == 1 || spbu.open_24_hours === '1' || spbu.open_24_hours === true;
var warnaMarker = isOpen24 ? '#007BFF' : '#DC3545';
// 5. LOOPING DATA & PILAH BERDASARKAN STATUS SPBU var marker = L.circleMarker([lat, lng], {
dataSpbuDariDatabase.forEach(function(spbu) { radius: 8,
var lat = parseFloat(spbu.latitude); fillColor: warnaMarker,
var lng = parseFloat(spbu.longitude); color: '#fff',
weight: 2,
fillOpacity: 0.9
});
var warnaMarker = (spbu.status === '24_jam') ? '#007BFF' : '#DC3545'; marker.bindPopup(
"<strong>" + (spbu.name || spbu.nama_spbu || 'SPBU') + "</strong><br>" +
"Status Pelayanan: " + (isOpen24 ? 'Buka 24 Jam' : 'Reguler Biasa') + "<br>" +
"Koordinat: " + lat + ", " + lng
);
var marker = L.circleMarker([lat, lng], { if (isOpen24) {
radius: 8, marker.addTo(layerSpbu24Jam);
fillColor: warnaMarker, } else {
color: '#fff', marker.addTo(layerSpbuReguler);
weight: 2, }
fillOpacity: 0.9
}); });
}
marker.bindPopup( function loadSpbuData() {
"<strong>" + spbu.nama_spbu + "</strong><br>" + fetch('api/get_points.php')
"Status Pelayanan: " + (spbu.status === '24_jam' ? 'Buka 24 Jam' : 'Reguler Biasa') + "<br>" + .then(function(response) {
"Koordinat: " + lat + ", " + lng if (!response.ok) {
); throw new Error('HTTP error ' + response.status);
}
return response.json();
})
.then(function(data) {
if (data.success && Array.isArray(data.markers)) {
renderSpbuMarkers(data.markers);
} else {
console.error('Response tidak berformat expected:', data);
}
})
.catch(function(error) {
console.error('Gagal memuat data SPBU dari API:', error);
});
}
if (spbu.status === '24_jam') { loadSpbuData();
marker.addTo(layerSpbu24Jam);
} else {
marker.addTo(layerSpbuReguler); // <-- Sudah diperbaiki dari layerSpulerReguler
}
});
// 6. IMPLEMENTASI LAYERS CONTROL // 6. IMPLEMENTASI LAYERS CONTROL
var overlayMaps = { var overlayMaps = {