Google Map Dengan HTML
Fitur
google Maps memungkinkan kita untuk melihat atau menampilkan peta pada halaman
web yang kita buat. Terkadang dalam perancangan web yang kita lakukan fitur ini
sangat diperlukan. Nah, ulasan kali ini kita akan belajar bagaimana menyisipkan
Google Map pada halaman HTML.
Berikut ini contoh dokumen html yang menyertakan map pada halamannya.
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Contoh Penggunaan Map pada halaman web</title>
<style>
html, body, #map-canvas {
height: 400px;
width: 400px;
margin: 0px;
padding: 0px
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
<script>
function initialize() {
var myLatlng = new google.maps.LatLng(-0.956614, 100.367874);
var mapOptions = {
zoom: 13,
center: myLatlng
}
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: 'Hello World!'
});
}
google.maps.event.addDomListener(window, 'load', initialize);
var myLatlng = new google.maps.LatLng(-0.956614, 100.367874);
var mapOptions = {
zoom: 13,
center: myLatlng
}
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: 'Hello World!'
});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<h1> Contoh Penggunaan Map pada HTML </h1>
<div id="map-canvas"></div>
</body>
</html>
Silahkan tinggalkan komentar jika ada yang ingin ditanyakan.
Silahkan tinggalkan komentar jika ada yang ingin ditanyakan.
Posts
0 comments:
Post a Comment