0

Un gran saludo.

Tengo una dificulta, no me carga el mapa en el sitio web, ¿Que debo hacer?

Muchas gracias. Imagen del error

<!-- Add Google Maps -->
<div id="googleMap" style="width:100%;height:400px"></div>
<script>
function myMap() {
var myCenter = new google.maps.LatLng(41.878114, -87.629798);
var mapProp = {center:myCenter, zoom:12, scrollwheel:false, draggable:false, mapTypeId:google.maps.MapTypeId.ROADMAP};
var map = new google.maps.Map(document.getElementById("googleMap"),mapProp);
var marker = new google.maps.Marker({position:myCenter});
marker.setMap(map);
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBu-916DdpKAjTmJNIgngS6HL_kDIKU0aU&callback=myMap"></script>

1
  • ¿Y te muestra algo en la consola de JavaScript? el 5 sep. 2017 a las 18:04

1 respuesta 1

1

Tu error se produce porque no tienes una Clave de api

Si te fijas en el script que usas, hay algo que se llama

key=AIzaSyBu-916DdpKAjTmJNIgngS6HL_kDIKU0aU&callback

esto es una clave de api que tendras que conseguir con Google Una vez que obtengas tu clave de api, solo sustituyes en esa parte de key=.... Te dejo un link con los pasos completos aqui Pasos para Obtener una clave de API

En esta sección, se explica la manera de autenticar tu app en la Google Maps JavaScript API con tu propia clave de API.

Sigue estos pasos para obtener una clave de API:

Dirígete a Google API Console. Crea o selecciona un proyecto. Haz clic en Continue para habilitar la API y cualquier servicio relacionado. En la página Credentials, obtén una clave de API (y configura sus restricciones).

Nota: Si ya tienes una clave de API sin restricciones o una clave con restricciones de navegador, puedes usarla. Para evitar el robo de cuota, protege tu clave de API siguiendo estas prácticas recomendadas. (Opcional) Habilita la facturación. Para obtener más información, consulta la sección de límites de uso. Copia todo el código del instructivo de esta página a tu editor de texto. Si no tienes un editor de texto, te recomendamos usar Notepad++ (para Windows); TextEdit (para macOS); y gedit, KWrite y otros (para máquinas Linux). Reemplaza el valor del parámetro key de la URL por tu propia clave de API (la que acabas de obtener).

Guarda este archivo con un nombre que termine en .html, como google-maps.html. Carga el archivo HTML a un navegador web: arrástralo de tu escritorio al navegador. En la mayoría de los sistemas operativos, otra alternativa es hacer doble clic en el archivo.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.