发表新帖
发表新帖

initMap is not a function

前端 未结
关注
4 367
南旧
南旧 2021-01-23 01:35

I can\'t understand what is the problem? I used this example from Google Map APIs: Simple Map
相关标签:
4条回答
  • 天命终不由人
    2021-01-23 02:13

    Try move in head the loading for script 

    <html>
  <head>
    <title>Simple Map</title>
    <meta name="viewport" content="initial-scale=1.0">
    <meta charset="utf-8">

    <script src="js/jquery.min.js"></script>
    <script src="js/main.js"></script>
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyB5Y8CqFe-4Egzl5TlPqlFvjRGcuCfHGvY&callback=initMap" async defer></script>

    and be sure for right path for 

         <script src="js/jquery.min.js"></script>
    <script src="js/main.js"></script>

    eventually try using relative path 

         <script src="./js/jquery.min.js"></script>
    <script src="./js/main.js"></script>
    0 讨论(0)
  • 慢半拍i
    2021-01-23 02:20

    Having the same issue, I personally removed the &callback=initMap to make it work. Other threads seams to show that initMap is a function you should build yourself.

    0 讨论(0)
  • 一整个雨季
    2021-01-23 02:34

    None of the solutions offered were helping me. I finally came across dynamic loading of the script here: https://developers.google.com/maps/documentation/javascript/overview#Loading_the_Maps_API

    Because you are loading it in a separate js file the google map api's are not loading in the correct order with the function.

    Doing this solved it for me:

    // Create the script tag, set the appropriate attributes
var script = document.createElement('script');
script.src = 'https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap';
script.defer = true;
    
// Attach your callback function to the `window` object
window.initMap = function() {
      // JS API is loaded and available
      // Throw your code within this, it will wait for the google api scripts to completely load
};
    
// Append the 'script' element to 'head'
document.head.appendChild(script);

    Hope this helps, I spent a day looking for solution.

    0 讨论(0)
  • 刺人心
    2021-01-23 02:36

    I had the same issue working on a wordpress template with Sage (a WordPress starter theme).

    My js was wrapped with 

    (function($) {

// all the functions to create map, center markers, etc.

}

    Then, the map was initialize in $(document).ready

    I removed (function($) { } and just add the functions without $(document).ready then it was ok.

    Also, be sure to load the custom js file before the api google map :

    <script src="custom-js-google-map.js"></script>

<script async defer
      src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap">
</script>
    0 讨论(0)
 看不清?
提交回复
热议问题