我建立了一个包含一些嵌入式地图和自定义标记的快速网站。它可以在我的Chrome桌面上工作正常,可以很好地处理我的Google Pixel,但是当我在Safari / iPhone上的Mac上查看它时,它不会显示或渲染地图(在Chrome中有效)。
以下是代码示例:
<div id="oakville-map" class="row map"></div>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=MYKEY&callback=initMap"></script>
<script>
//Maps
var iconBase = '/pathtomarker/markers/red_circle_';
var icons = {
one: {
icon: iconBase + '1.png'
},
two: {
icon: iconBase + '2.png'
},
three: {
icon: iconBase + '3.png'
},
four: {
icon: iconBase + '4.png'
},
five: {
icon: iconBase + '5.png'
},
six: {
icon: iconBase + '6.png'
}
};
var element = document.getElementById('oakville-map');
if (typeof(element) != 'undefined' && element != null)
{
//Oakville Map
function initMap() {
var tmhOakville = {lat: 43.5113563, lng: -79.6873432};
var Oakvillemap = new google.maps.Map(document.getElementById('oakville-map'), {
zoom: 13,
center: tmhOakville
});
var features = [
{
position: tmhOakville,
type: 'one'
}
];
// Create markers.
features.forEach(function(feature) {
var marker = new google.maps.Marker({
position: feature.position,
icon: icons[feature.type].icon,
map: Oakvillemap
});
});
}
}
</script>
如果某些页面上的各种地图的块有多个,但是所有这些的语法都相同。没有涉及地理编码,只需使用自定义标记进行简单嵌入。
任何人都可以看到为什么这不会在safari / iOS中加载?感谢
答案 0 :(得分:0)
问题是每个if语句都覆盖了initMap函数,因此只加载最后一个映射。仍然不确定为什么它会在Chrome中呈现良好但在Safari / iOS中没有呈现,该功能只会使用最后一个if语句呈现。