feat(bank-data): tambahkan info window untuk marker peta

- Menambahkan array untuk menyimpan info window.
- Membuat konten info window yang menampilkan detail aset.
- Menambahkan event listener untuk marker agar info window terbuka saat marker diklik.
- Menutup semua info window yang terbuka saat marker baru diklik.
This commit is contained in:
Daeng Deni Mardaeni
2025-03-18 07:25:27 +07:00
parent 6befc5faa7
commit 047e543d8d

View File

@@ -173,6 +173,7 @@
<script>
let map;
let markers = [];
let infoWindows = [];
let dataTable;
function initMap() {
@@ -183,10 +184,11 @@
}
function updateMapMarkers(data) {
console.log(data);
// Clear existing markers
markers.forEach(marker => marker.setMap(null));
infoWindows.forEach(infoWindow => infoWindow.close());
markers = [];
infoWindows = [];
// Add new markers
data.forEach(item => {
@@ -213,7 +215,36 @@
map: map,
title: item.jenis_aset
});
// Create info window content
const contentString = `
<div>
<h3>${item.jenis_aset}</h3>
<p>Tanggal: ${item.tanggal}</p>
<p>Tahun: ${item.tahun}</p>
<p>Luas Tanah: ${item.luas_tanah} m²</p>
<p>Luas Bangunan: ${item.luas_bangunan} m²</p>
<p>Harga: ${window.formatRupiah(item.harga)}</p>
<p>Nilai Pasar: ${window.formatRupiah(item.nilai_pasar)}</p>
</div>
`;
// Create info window
const infoWindow = new google.maps.InfoWindow({
content: contentString
});
// Add click event to marker
marker.addListener('click', () => {
// Close all open info windows
infoWindows.forEach(window => window.close());
// Open this marker's info window
infoWindow.open(map, marker);
});
markers.push(marker);
infoWindows.push(infoWindow);
} else {
console.error('Invalid location format for item:', item);
}