google maps ne pas apparaître sur l'application flacon

Question

J'ai fait une application flacon qui devrait techniquement charger google map selon leur tutorial.

mais à ma grande surprise, tout fonctionne localement et sur hosted on heroku et aucune erreur ne vient mais les cartes ne chargent pas.

<div id="map"></div> 

      <script type="text/javascript"> 
        var map; 
        function initMap() { 
         map = new google.maps.Map(document.getElementById('map'), { 
          center: {lat: {{lat}}, lng: {{lng}}}, 
          zoom: 16 
          }); 
         console.log("map function"); 
         console.log(map); 
        } 
      </script> 

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key={{key}}&callback=initMap" async defer></script> 

s'il vous plaît jeter un oeil à javascript sortie de la console, vous verrez deux estampes, d'abord on dit fonction de carte est deuxième objet carte créé la latitude et la longitude passée à initMap fonction. cela signifie que l'objet map a été créé mais n'a pas mis à jour div avec map id!

Aucun des Error Code listed sur google page ne se produit.

Answer 1

La plupart du temps, cela a quelque chose à voir avec la clé API. Assurez-vous que vous en avez créé un de la bonne façon et qu'il est activé et en cours d'exécution. J'espère que j'ai aidé.