feat(bank-data): tambahkan tombol untuk mendapatkan petunjuk arah
- Menambahkan tombol "Get Directions" di tampilan data bank. - Mengimplementasikan fungsi getDirections untuk membuka Google Maps dengan rute dari lokasi pengguna ke lokasi tujuan. - Menggunakan geolocation API untuk mendapatkan lokasi pengguna saat ini.
This commit is contained in:
@@ -320,6 +320,12 @@
|
|||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="border-t border-gray-300 border-dashed"></div>
|
||||||
|
<div class='flex justify-end mt-3'>
|
||||||
|
<button onclick="getDirections(${lat}, ${lng})" class='btn btn-sm btn-primary'>
|
||||||
|
Get Directions
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
@@ -354,6 +360,26 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
function getDirections(lat, lng) {
|
||||||
|
console.log('Getting directions to:', lat, lng);
|
||||||
|
if (navigator.geolocation) {
|
||||||
|
navigator.geolocation.getCurrentPosition(
|
||||||
|
(position) => {
|
||||||
|
const origin = position.coords.latitude + ',' + position.coords.longitude;
|
||||||
|
const destination = lat + ',' + lng;
|
||||||
|
const url = `https://www.google.com/maps/dir/?api=1&origin=${origin}&destination=${destination}`;
|
||||||
|
window.open(url, '_blank');
|
||||||
|
},
|
||||||
|
() => {
|
||||||
|
alert('Unable to get your current location. Please enable location services.');
|
||||||
|
}
|
||||||
|
);
|
||||||
|
} else {
|
||||||
|
alert('Geolocation is not supported by your browser.');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function initializeDataTable() {
|
function initializeDataTable() {
|
||||||
const element = document.querySelector('#bank-data-table');
|
const element = document.querySelector('#bank-data-table');
|
||||||
const searchInput = document.getElementById('search');
|
const searchInput = document.getElementById('search');
|
||||||
|
|||||||
Reference in New Issue
Block a user