Necesito integrar un mapa de google en mi página web. Genere una API. Pero el mapa no se muestra. Lo estoy probando en mi servidor local.

<h3>My Google Maps Demo</h3>
<div id="map">
    <span class="labels">Heading</span>
</div>
<script  src="https://maps.googleapis.com/maps/api/js?key=[API]&callback=initMap">
</script>
<script type="text/javascript">
    function initMap() {
                alert("Yes");
                var uluru = { lat: -25.363, lng: 131.044 };
                var map = new google.maps.Map(document.getElementById('map'), {
                    zoom: 4,
                    center: uluru
                });
                var marker = new google.maps.Marker({
                    position: uluru,
                    map: map
                });
            }
</script>

Pero no sirve de nada. ¿Hay algún problema en mi código? ¿Puedo verificar si mi API funciona o no?

-1
Jks 27 oct. 2017 a las 09:27

4 respuestas

La mejor respuesta

Debe tener una clave de API para acceder a los mapas. Modifique su código así:

Js:

 function initMap() {
   alert("Yes");
   var uluru = {
     lat: -25.363,
     lng: 131.044
   };
   var map = new google.maps.Map(document.getElementById('map'), {
     zoom: 4,
     center: uluru
   });
   var marker = new google.maps.Marker({
     position: uluru,
     map: map
   });

 }
 google.maps.event.addDomListener(window, "load", initMap);

Compruebe esta demostración: http://jsfiddle.net/lotusgodkk/hLenqzmy/64/

Puede obtener la clave de la API desde aquí: https://developers.google .com / maps / documentation / javascript / get-api-key

1
K K 27 oct. 2017 a las 06:49

Tu código funciona bien. Debe colocar una API de Google JavaScript allí (supongo que colocó otra clave de Google Maps)

enter image description here

Consulte también este enlace para algunos google ejemplos

1
Florian Zaskoku 27 oct. 2017 a las 06:37

No puedo comentar, así que escribo aquí. ¿Tienes código clave?

En la consola, hay errores:

RefererNotAllowedMapError Error
La URL actual que carga la API de JavaScript de Google Maps no se ha agregado a la lista de referencias permitidas. Verifique la configuración de referencia de su clave API en la Consola API de Google.

Consulte las claves API en la Consola API de Google. Para obtener más información, consulte las mejores prácticas para usar de forma segura las claves API.

Tal vez esto te ayudaría.

3
noob 21 feb. 2019 a las 13:18

Además, se invocará initMap mientras se carga la página y ¿PODRÍA no haberse declarado en el momento en que se llamó?

0
Patrick Sturm 27 oct. 2017 a las 06:33