如何正确排列地图？
问题描述：
我正在使用Root的主题 - 鼠尾草如何正确排列地图？
我试图排队谷歌地图，一直在它几个小时没有成功。
我一直在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&callback=initMap'></script>
<script type='text/javascript' src='//localhost:3000/app/themes/***********/dist/scripts/main.js'></script>
任何人都可以帮助我吗？
我被告知这个，但我不确定如何做到这一点？
这里最有可能发生的事情是，谷歌地图最终在sage/js后排入队列 。你的条件块应该考虑到这一点，并添加 谷歌地图作为sage/js的依赖。
答
由于charlietfl说明有关相关
wp_enqueue_script('google-maps', '//maps.googleapis.com/maps/api/js?key=MY_API_KEY_HERE&callback=initMap', ['sage-js'], null, true);
我需要添加 '圣人-JS' 作为一个依赖于地图。
initmap（）被埋在'Sage'中......它在全球范围内无法访问，您可以在其中设置回调 – charlietfl
您是否能够提供解决方案作为解释性/示范性答案？ – ProEvilz
最快的解决方案是将地图代码从Sage中取出。除此之外，你需要阅读JavaScript范围和关闭 – charlietfl