¿Qué es Google Maps?
Google Maps es una API de Google
Google Fonts es una API de Google
Google Charts es una API de Google
Aprenda a agregar Google Maps a su página web.
Mi primer mapa de Google
Comience con una página web simple.
Agregue un elemento <div> donde desee que se muestre el mapa y establezca el tamaño del mapa:
Ejemplo
<!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>
Agregue una función de JavaScript para mostrar el mapa:
Ejemplo
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);
}
La variable mapCanvas es el elemento HTML del mapa.
La variable mapOptions define las propiedades del mapa.
La propiedad del centro especifica dónde centrar el mapa (usando las coordenadas de latitud y longitud).
La propiedad de zoom especifica el nivel de zoom para el mapa (intente experimentar con el nivel de zoom).
El objeto google.maps.Map se crea con mapCanvas y mapOptions como parámetros.
Finalmente agregue la API de Google
La funcionalidad del mapa es proporcionada por una biblioteca de JavaScript ubicada en Google:
Ejemplo
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_KEY&callback=myMap"></script>
Tutorial de mapas de Google
Obtenga más información sobre Google Maps en nuestro Tutorial de Google Maps .