Pelajari cara menambahkan Google Map ke halaman web.
Sebuah Halaman Web Dasar
Semua halaman web yang ditulis dalam HTML.
Untuk menunjukkan cara menambahkan Google Map ke halaman web, kita akan menggunakan sebuah halaman web dasar sederhana:
Contoh
<!DOCTYPE html>
<html>
<body>
<h1>My First Google Map</h1>
<div id="map">My map will go here</div>
</body>
<html>
Cobalah sendiri " Mengatur Ukuran Peta
Mengatur ukuran peta:
Tambahkan API Google
Fungsi dari peta disediakan oleh perpustakaan JavaScript yang terletak di Google.
Perpustakaan JavaScript dapat dimuat dalam <head> bagian dari halaman HTML.
Sebenarnya Anda bisa drop <head> dan </head> tag.
Contoh
<head>
<script src="https://maps.googleapis.com/maps/api/js"></script>
</head>
Cobalah sendiri " Buat Peta Menggunakan JavaScript
Terakhir tambahkan diperlukan JavaScript ke halaman:
Contoh
var mapCanvas =
document.getElementById("map");
var mapOptions = {
center: new google.maps.LatLng(51.5, -0.2), zoom:
10
}
var map = new google.maps.Map(mapCanvas,
mapOptions); Cobalah sendiri " misalnya Dijelaskan
mapCanvas adalah peta ini elemen HTML.
mapOptions adalah pilihan peta ini.
Pusat properti mendapat lintang dan bujur (dari London) dengan menelepon google.maps. LatLng() google.maps. LatLng() .
Properti zoom diatur ke 10. (mencoba untuk bereksperimen dengan zoom)
The google.maps.Map objek dibuat dengan mapCanvas dan mapOptions sebagai parameter.
Pergi ke kami Google Maps API Tutorial . untuk mempelajari lebih lanjut tentang Google Maps.