Hallo sobat, pada tulisan kali ini Saya ingin membahas tentang tipe peta apa saja yang ada di Google Maps dan bagaimana cara menggunakannya. Pasti Kalian sudah penasaran kan? Tanpa panjang lebar lagi, Yuk mari baca dan simak tulisan ini sampai habis. Di jamin akan memberikan manfaat yang besar untuk menambah pengetahuan Anda. Oke, langsung saja ya.
Pada Google Maps terdapat 4 tipe peta yang bisa Anda gunakan yaitu ROADMAP, SATELLITE, HYBRID dan TERRAIN. Berikut ini penjelasannya :
1. ROADMAP, tipe ini berupa peta normal dengan tampilan 2 dimensi dan merupakan peta standar dari Google Maps. Cara menggunakannya dengan menyisipkan script mapTypeId:google.maps.MapTypeId.ROADMAP, lihat contoh script di bawah ini :
<html>
<head>
<title> Google Maps API: Cara Mengubah Tipe Peta </title>
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap" async defer></script>
<script type="text/javascript">
function initMap() {
var map = new google.maps.Map(document.getElementById('show_maps'), {
center: {lat: -1.035721, lng: 118.436931},
zoom: 5,
mapTypeId:google.maps.MapTypeId.ROADMAP
});
}
</script>
</head>
<body>
<div id="show_maps" style="width:100%;height:100%;"></div>
</body>
</html> Bila dijalankan, script di atas akan menghasilkan Output seperti berikut ini :
2. SATELLITE, merupakan tampilan peta dengan citra satelit Google Earth. Cara menggunakannya dengan menyisipkan script mapTypeId:google.maps.MapTypeId.SATELLITE, lihat contoh script di bawah ini :
<html>
<head>
<title> Google Maps API: Cara Mengubah Tipe Peta </title>
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap" async defer></script>
<script type="text/javascript">
function initMap() {
var map = new google.maps.Map(document.getElementById('show_maps'), {
center: {lat: -1.035721, lng: 118.436931},
zoom: 5,
mapTypeId:google.maps.MapTypeId.SATELLITE
});
}
</script>
</head>
<body>
<div id="show_maps" style="width:100%;height:100%;"></div>
</body>
</html> Bila dijalankan, script di atas akan menghasilkan Output seperti berikut ini :
3. HYBRID, merupakan peta campuran berupa tampilan citra satelit yang disertai dengan fitur peta normal berupa nama jalan, kota dan lain-lain. Cara menggunakannya dengan menyisipkan script mapTypeId:google.maps.MapTypeId.HYBRID, lihat contoh script di bawah ini :
<html>
<head>
<title> Google Maps API: Cara Mengubah Tipe Peta </title>
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap" async defer></script>
<script type="text/javascript">
function initMap() {
var map = new google.maps.Map(document.getElementById('show_maps'), {
center: {lat: -1.035721, lng: 118.436931},
zoom: 5,
mapTypeId:google.maps.MapTypeId.HYBRID
});
}
</script>
</head>
<body>
<div id="show_maps" style="width:100%;height:100%;"></div>
</body>
</html> Bila dijalankan, script di atas akan menghasilkan Output seperti berikut ini :
4. TERRAIN, merupakan tipe peta yang menampilkan bentuk fisik berdasarkan informasi di lapangan seperti dataran tinggi, dataran rendah, pegunungan, sungai dan lain-lain. Cara menggunakannya dengan menyisipkan script mapTypeId:google.maps.MapTypeId.TERRAIN, lihat contoh script di bawah ini :
<html>
<head>
<title> Google Maps API: Cara Mengubah Tipe Peta </title>
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap" async defer></script>
<script type="text/javascript">
function initMap() {
var map = new google.maps.Map(document.getElementById('show_maps'), {
center: {lat: -1.035721, lng: 118.436931},
zoom: 5,
mapTypeId:google.maps.MapTypeId.TERRAIN
});
}
</script>
</head>
<body>
<div id="show_maps" style="width:100%;height:100%;"></div>
</body>
</html> Bila dijalankan, script di atas akan menghasilkan Output seperti berikut ini :
Demikian pembahasan tentang Google Maps API: Cara Membuat Peta ROADMAP, SATELLITE, HYBRID dan TERRAIN, semoga tulisan ini bisa memberikan manfaat untuk Anda yang membaca. Sampai jumpa di tulisan berikutnya. Terima Kasih
