如何正確排列地圖？

我試圖排隊谷歌地圖，一直在它幾個小時沒有成功。

我一直在Chrome的控制檯收到此錯誤：

Uncaught InvalidValueError: initMap is not a function ... js?key=MY_API_KEY&callback=initMap:95

從我可以工作了，這意味着它無法找到像腳本排序的經典jQuery的不確定問題的功能。

setup.php

/** 
* Theme assets 
*/ 

function assets() { 
    wp_enqueue_style('sage/css', Assets\asset_path('styles/main.css'), false, null); 

    wp_enqueue_style('font-awesome', '//maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css', false, null); 

    if (is_single() && comments_open() && get_option('thread_comments')) { 
    wp_enqueue_script('comment-reply'); 
    } 
    wp_enqueue_script('sage/js', Assets\asset_path('scripts/main.js'), ['jquery'], null, true); 

    wp_enqueue_script('jquery-validate', '//cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.1/jquery.validate.min.js', [], null, true); 

    if (is_page_template('template-about.php')) { 
    wp_enqueue_script('google-maps', '//maps.googleapis.com/maps/api/js?key=MY_API_KEY_HERE&callback=initMap', [], null, true); 
    } 

} 
add_action('wp_enqueue_scripts', __NAMESPACE__ . '\\assets', 100);

我Main.js

(function($) { 
    // Use this variable to set up the common and page specific functions. If you 
    // rename this variable, you will also need to rename the namespace below. 
    var Sage = { 
    // All pages 
    'common': { 
      init: function() { 

      if (!$('body').hasClass('home')) { 
       $(this).find('.banner').removeClass('navbar-fixed-top'); 
      } 

      var map; 
      console.log('reached'); 

      function initMap() { 
       var location = {lat: 51.47672559, lng: -3.17107379}; 
       var markerloc = {lat: 51.476852, lng: -3.167869}; 
       map = new google.maps.Map(document.getElementById('map'), { 
       center: location, 
       scrollwheel: false, 
       zoom: 17 
       }); 
       var marker = new google.maps.Marker({ 
       position: markerloc, 
       map: map, 
       title: 'Hello World!' 
       }); 

      } 
     } 
      },

106線的摘錄是谷歌地圖URL行。具體是&callback=initMap部分。

腳本在DOM中出現像這樣。

<script type='text/javascript' src='//maps.googleapis.com/maps/api/js?key=MY_API_KEY_HERE&#038;callback=initMap'></script> 

<script type='text/javascript' src='//localhost:3000/app/themes/***********/dist/scripts/main.js'></script>

任何人都可以幫助我嗎？

我被告知這個，但我不確定如何做到這一點？

這裏最有可能發生的事情是，谷歌地圖最終在sage/js後排入隊列。你的條件塊應該考慮到這一點，並添加谷歌地圖作爲sage/js的依賴。

來源

2016-09-29 ProEvilz

initmap（）被埋在'Sage'中......它在全球範圍內無法訪問，您可以在其中設置回調 – charlietfl

您是否能夠提供解決方案作爲解釋性/示範性答案？ – ProEvilz

最快的解決方案是將地圖代碼從Sage中取出。除此之外，你需要閱讀JavaScript範圍和關閉 – charlietfl

由於charlietfl說明有關相關

wp_enqueue_script('google-maps', '//maps.googleapis.com/maps/api/js?key=MY_API_KEY_HERE&callback=initMap', ['sage-js'], null, true);

我需要添加 '聖人-JS' 作爲一個依賴於地圖。

來源

2016-09-29 19:01:12 ProEvilz

如何正確排列地圖？

回答

相關問題