Google Maps adalah sebuah jasa peta globe virtual gratis dan online yang disediakan oleh Google. Melalui Google Maps ini, sekarang kita tak perlu lagi repot-repot menggunakan peta konvensional saat harus melakukan perjalanan yang cukup jauh di wilayah yang tidak kita ketahui. Hanya dengan mengetikkan alamat yang akan dituju, Google Maps akan mengarahkan Anda ke tempat tujuan dengan jalur yang cukup terperinci.
Kita juga bisa menampilkan sebuah map pada halaman web milik kita dengan menggunakan Google Maps.
Google Maps API
Tutorial ini akan membahas mengenai Google Maps API (Application Programming Interface). Dengan Google Maps API kita bisa membuat kostumisasi terhadap maps dan informasi yang ada pada maps dengan kode Javascript.
Membuat Basic Map
Berikut ini merupakan contoh bagaimana untuk menampilkan maps dengan map center di bandung.
<!DOCTYPE html>
<html>
<head>
<!-- Load google API -->
<script src="https://maps.googleapis.com/maps/api/js"></script>
<script>
function initialize() {
var options = {
center:new google.maps.LatLng(-6.9147444,107.6098111), // longitude latitude bandung
zoom:5,
mapTypeId:google.maps.MapTypeId.ROADMAP // Tipe ROADMAP
};
// create map object
var map=new google.maps.Map(document.getElementById("googleMap"),options);
}
// membuat Event Listener untuk memanggil fungsi initialize pada saat halaman selesai di load
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<!-- Map container -->
<div id="googleMap" style="width:500px;height:380px;"></div>
</body>
</html>
No Comments
Leave a comment Cancel