Scopri come aggiungere una mappa di Google ad una pagina web.
Una pagina Web di base
Tutti pagina web sono scritti in HTML.
Per dimostrare come aggiungere una mappa di Google a una pagina web, useremo una semplice pagina Web di base:
Esempio
<!DOCTYPE html>
<html>
<body>
<h1>My First Google Map</h1>
<div id="map">My map will go here</div>
</body>
<html>
Prova tu stesso " Impostare la dimensione della mappa
Impostare la dimensione della mappa:
Aggiungere l'API di Google
La funzionalità della mappa è fornita da una libreria JavaScript situato a Google.
La libreria JavaScript può essere caricato nel <head> sezione della pagina HTML.
In realtà è possibile eliminare i <head> e </head> tag.
Esempio
<head>
<script src="https://maps.googleapis.com/maps/api/js"></script>
</head>
Prova tu stesso " Creare la mappa con JavaScript
Infine aggiungere il codice JavaScript necessario alla pagina:
Esempio
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); Prova tu stesso " esempio spiegato
mapcanvas è elemento HTML della mappa.
mapOptions è opzioni della mappa.
La struttura centrale ottiene la latitudine e longitudine (di Londra) chiamando google.maps. LatLng() google.maps. LatLng() .
La proprietà di zoom è impostato a 10. (provare a sperimentare con lo zoom)
L'oggetto google.maps.Map viene creato con mapcanvas e mapOptions come parametri.
Vai al nostro Google Maps API Tutorial . per ulteriori informazioni su Google Maps.