Fehler bei Verwendung der Google Maps-API "Nicht erfasster Referenzfehler: Google ist nicht definiert".

Ich versuche, eine Markierung auf der Karte anzupassen, erhalte aber immer wieder die Meldung "Google ist nicht definiert". Ich habe verschiedene Dinge ausprobiert, aber es funktioniert immer noch nicht. Ich habe vor dem Initialisieren der Karte einen API-Schlüssel verwendet und auch das Kartenskript eingefügt. Das ist mein HTML:

 <html class="no-js" lang="en-US" >
        <head>
            <meta charset="UTF-8" />
            <meta name="viewport" content="width=device-width, initial-scale=1.0" />
            <title>Home &#8211; Algebra</title>
    <link rel='dns-prefetch' href='//ajax.googleapis.com' />
    <link rel='dns-prefetch' href='//s.w.org' />
    <script type='text/javascript' src='//ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js?ver=2.1.0'></script>
    <link rel='https://api.w.org/' href='http://localhost/algebra/wp-json/' />
    <link rel="alternate" type="application/json+oembed" href="http://localhost/algebra/wp-json/oembed/1.0/embed?url=http%3A%2F%2Flocalhost%2Falgebra%2Fhome%2F" />
    <link rel="alternate" type="text/xml+oembed" href="http://localhost/algebra/wp-json/oembed/1.0/embed?url=http%3A%2F%2Flocalhost%2Falgebra%2Fhome%2F&#038;format=xml" />
        </head>
        <body class="page page-id-4 page-template page-template-page-templates page-template-page-home page-template-page-templatespage-home-php logged-in offcanvas">



    <header id="masthead" class="site-header" role="banner">
        <div class="top-strip"></div>
        <div class="top-nav"></div>
    </header>

    <section class="container">
<section class="map">
    <div id="map-container"></div>
  <div class="contact-container">
    <div class="contact">
      <img src="" alt="mail-icon">
      <span>You can contact us at [email protected]</span>
    </div>
  </div>
</section>
        </section>
        <div id="footer-container">
            <footer id="footer">
            </footer>
        </div>
  <script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAKX-BAa2bSAiC89C38o8ir29Q7iOWdQ94&callback=initMap"
  type="text/javascript"></script>
<script type='text/javascript''>
var myCenter = new google.maps.LatLng(29.714954,32.368546);
    function initMap() {
  var mapProp = {
    center:myCenter,
    zoom:13,
    mapTypeId:google.maps.MapTypeId.ROADMAP
  };
  var map=new google.maps.Map(document.getElementById("map-container"),mapProp);
  var marker=new google.maps.Marker({
  position:myCenter,
  title: "AZHA"
  });
  marker.setMap(map);
  var infowindow = new google.maps.InfoWindow({
  content:"AZHA"
  });
  infowindow.open(map,marker);
}
// google.maps.event.addDomListener(window, 'load', initMap);
</script>
<script type='text/javascript' src='http://localhost/algebra/wp-includes/js/wp-embed.min.js?ver=4.6.1'></script>
</body>
</html>

Ich würde mich über Hilfe freuen, danke.

Antworten auf die Frage(2)

Ihre Antwort auf die Frage