我做自定义wordpress寺庙网站与谷歌地图脚本,和php代码。我有问题加载它,他们不总是工作,有时我必须刷新网站十次,直到它开始工作。
如果它们不起作用,我就会出错。
"initMap is not a function"
我的寺庙网站的Code:
#colophon{
display: none;
}
.page-template {
background-color: black!important;
}
.gm-style-iw {
height: 165px!important;
width: 300px!important;
}
Wielki format
Citylight
Backlight
'product');
$loop = new WP_Query( $args );
foreach ($loop->posts as $post){
$storeData[] = [
'title' => apply_filters('the_title', $post->post_title),
'url' => get_permalink(),
'num' => get_field('numer_katalogowy'),
'lat' => get_field('gps_dlugosc'),
'long' => get_field('szerokosc_gps'),
'surface' => get_field('powierzchnia'),
'height' => get_field('dlugosc'),
'width' => get_field('szerokosc'),
'light' => get_field('oswietlenie'),
];
}
wp_localize_script('my-map-script', 'storeData', $storeData);
?>
js文件的Code:
function initMap() {
// The location of Uluru
var poznan = {lat: 52.402684, lng: 16.9213905};
var j = storeData.length;
var infowindow = new google.maps.InfoWindow({
maxWidth: 200
});
var marker, i;
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 15,
center: poznan,
}
);
for (i = 0; i < j; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(storeData[i].lat, storeData[i].long),
map: map
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
infowindow.setContent(
'' +
'' + storeData[i].title + '' +
'' + storeData[i].num + '' +
'' + 'Wysokość: ' + storeData[i].height + ' m'+ '' +
'' + 'Szerokość: ' + storeData[i].width + ' m'+ '' +
'' + 'Powierzchnia: ' + storeData[i].surface + ' m2'+ '' +
'' + 'Oświetlenie: ' + storeData[i].light + '' +
'' + 'Przejdź do powierzchni' + '' +
''
);
infowindow.open(map, marker);
}
})(marker, i));
}
}
我认为这个问题可以按脚本顺序处理,但我不知道如何解决。有问题的工地入口:
我的网站
发布于 2018-12-07 13:54:43
Google脚本URL的这一部分是罪魁祸首:
&callback=initMap
这意味着,当加载脚本时,它将尝试运行initMap()
函数,但在页中部输出的Google </code>标记之后,您将在页脚中包含函数的脚本排队。这意味着在Google尝试运行<code>initMap()</code>之前不会加载脚本。</div><div>您应该使用<code>wp_enqueue_script()</code>对Google脚本进行排队,并将您的自定义脚本作为依赖项,以确保它们以正确的顺序加载。</div><div>因此,删除<code><script></code>标记并添加:</div><pre><code>wp_enqueue_script( 'google-maps', 'https://maps.googleapis.com/maps/api/js?key=AIzaSyAg-GBNbwLWCxiN-UI-0COkr1bgAKpXjQU&callback=initMap', [ 'my-map-script' ], null, true );</code></pre><div>这将确保Google脚本将在脚本之后加载,从而确保<code>initMap()</code>函数可用。</div>
https://wordpress.stackexchange.com/questions/321288
复制相似问题