我有WordPress版本的网站。 5.1.1(OceanWP主题)。我使用GoogleMaps API在我的图书馆中创建了新模板(我从Google平台获得了正确的API密钥), 我为#map对象添加了CustomJS javascript函数initMap()和customCSS, 但所有对象google maps都未显示在网站http：//上wp.??loxx.pl/?oceanwp_library=googlemapsplfr。在调试器和控制台中, 你可以看到该网站已正确加载, 并且可以在google api内部启动。
任何想法, 为什么这个疯狂的WordPress的不显示谷歌对象？
【WordPress不显示没有插件的对象GoogleMapsAPI】如果我从VS开发人员创建了简单页面, 那么一切都会顺利进行。
//我的模板中的HTML：
<
div id="map">
<
/div>
<
script async defer src="https://maps.googleapis.com/maps/api/js?key=MY_API_KEY&
callback=initMap">
<
/script>
// CustomJS
function initMap() {
var laender = "'FR', 'PL'";
var breitengrad = 53.4708393;
var laengengrad = 7.4848308;
var zoomstufe = 4;
var mapOptions = {
// How zoomed in you want the map to start at (always required)
zoom: zoomstufe, scrollwheel: false, draggable: true, // The latitude and longitude to center the map (always required)
center: new google.maps.LatLng(breitengrad, laengengrad), // New York// How you would like to style the map.
// This is where you would paste any style found on Snazzy Maps.
styles: [{"stylers":[{"hue":"#1382b9"}, {"saturation":45}]}, {"featureType":"water", "stylers":[{"color":"#74c7f1"}]}, {"featureType":"all", "elementType":"labels", "stylers":[{"visibility":"off"}]}, {"featureType":"administrative", "elementType":"labels", "stylers":[{"visibility":"on"}]}, {"featureType":"road", "elementType":"all", "stylers":[{"visibility":"off"}]}, {"featureType":"transit", "elementType":"all", "stylers":[{"visibility":"off"}]}]
};
var mapElement = document.getElementById('map');
//mapElement.style.width = '1900px';
//mapElement.style.height = '661px';
// Create the Google Map using our element and options defined above
var map = new google.maps.Map(mapElement, mapOptions);
var world_geometry = new google.maps.FusionTablesLayer({
query: {
select: 'geometry', from: '1N2LBk4JHwWpOY4d9fobIn27lfnZ5MDy-NoqqRpk', where: 'ISO_2DIGIT IN (' + laender + ')'
}, styles: [{polygonOptions: {
fillColor: "#FF0039", fillOpacity: 0.3, strokeColor: "#FF0039", strokeWeight: "int", strokeOpacity: 0.4
}
}], map: map, suppressInfoWindows: true
});
var center;
function calculateCenter() {
center = map.getCenter();
}
google.maps.event.addDomListener(map, 'idle', function() {
calculateCenter();
});
google.maps.event.addDomListener(window, 'resize', function() {
map.setCenter(center);
});
}//自定义CSS
#map { height: 100%;
}
html, body { height: 100%;
margin: 0;
padding: 0;
}
#1请尝试将Google Map脚本放在标题部分, 然后再次检查, 可能会起作用
推荐阅读
- WordPress不读取样式表
- WordPress无法识别/themes/文件夹中的主题
- WordPress不会转到自定义帖子类型页面
- WordPress不会导出或导入特色图片
- Word新闻不显示主题
- wordpress新主题自定义otf字体
- WordPress多站点到单个站点-主题如何容纳新的WordPress版本（）
- 快乐就完事
- 工作队列