Wat is Google Maps?
Google Maps is 'n Google API
Google Fonts is 'n Google API
Google Charts is 'n Google API
Leer hoe om Google Maps by jou webblad te voeg.
My eerste Google Map
Begin met 'n eenvoudige webblad.
Voeg 'n <div>-element by waar jy wil hê die kaart moet vertoon, en stel die grootte van die kaart in:
Voorbeeld
<!DOCTYPE html>
<html>
<body>
<h1>My First Google Map</h1>
<div id="map" style="width:100%;height:400px;">My map will go here</div>
</body>
<html>
Voeg 'n JavaScript-funksie by om die kaart te vertoon:
Voorbeeld
function myMap() {
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);
}
Die mapCanvas- veranderlike is die kaart se HTML-element.
Die mapOptions veranderlike definieer die eienskappe vir die kaart.
Die sentrum- eienskap spesifiseer waar om die kaart te sentreer (deur breedte- en lengtegraad-koördinate te gebruik).
Die zoem -eienskap spesifiseer die zoemvlak vir die kaart (probeer om met die zoemvlak te eksperimenteer).
Die google.maps.Map- objek word geskep met mapCanvas en mapOptions as parameters.
Voeg uiteindelik die Google API by
Die funksionaliteit van die kaart word verskaf deur 'n JavaScript-biblioteek wat by Google geleë is:
Voorbeeld
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY&callback=myMap"></script>
Google Maps Tutoriaal
Kom meer te wete oor Google Maps in ons Google Maps-tutoriaal .