Skip to content

Instantly share code, notes, and snippets.

@endymuhardin

endymuhardin/belajar-embed-gmap.html

Created August 24, 2016 03:09
Show Gist options
  • Save endymuhardin/4a904b370028798d944b3821026f1cad to your computer and use it in GitHub Desktop.
Save endymuhardin/4a904b370028798d944b3821026f1cad to your computer and use it in GitHub Desktop.
Download ZIP
Contoh HTML untuk menampilkan Google Map
Raw
belajar-embed-gmap.html
<html>
<head><title>Belajar Geolocation</title></head>
<body>
<h1>Belajar Embed Google Map</h1>
Masukkan koordinat :
<input id="koordinat" type="text" value="-6.2420783,106.8469983">
<button onclick="updatePeta()">Tampilkan di Peta</button>
<hr>
<iframe id="peta"
width="600"
height="450"
frameborder="0"
style="border:0"
src="https://www.google.com/maps/embed/v1/place?key=AIzaSyAR74ruQ8bB8wtJyxmO_qkrDPF2pLHSK90&q=-6.2420783,106.8469983"
allowfullscreen>
</iframe>
<script>
function updatePeta(){
var koordinat = document.getElementById('koordinat').value;
console.log("Koordinat : "+koordinat);
var url = "https://www.google.com/maps/embed/v1/place?key=AIzaSyAR74ruQ8bB8wtJyxmO_qkrDPF2pLHSK90&q="+koordinat;
console.log("URL : "+url);
document.getElementById('peta').src = url;
}
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment