苹果safari浏览器openLocation打开腾讯地图底部导航栏被浏览器导航栏遮挡

苹果safari浏览器openLocation打开腾讯地图底部导航栏被浏览器导航栏遮挡

示例代码:

uni.openLocation({  
    latitude: parseFloat(item.lat),  
    longitude: parseFloat(item.long),  
    scale: 8,  
    name: item.mer_name,  
    address: item.mer_address ? item.mer_address: '',  
    success: function(res) {  
    },  
});

操作步骤:

  • 打开地图

预期结果:

  • 减掉浏览器导航栏的高度

实际结果:

bug描述:

苹果safari浏览器openLocation打开腾讯地图底部导航栏被浏览器导航栏遮挡,只能按住定位往下拖动才能看到

Image 1

Image 2


3 回复

你好,我这同样使用 safiri 测试,没有发现这个问题,我这测试的效果是直接展示,没有发现隐藏的情况


用了几个手机测试都是这样,这个地图应该不受网页样式影响吧

这个问题是iOS Safari浏览器中调用uni.openLocation打开腾讯地图时,底部导航栏被浏览器工具栏遮挡的常见问题。原因是Safari的底部工具栏会覆盖部分页面内容。

解决方案:

  1. 使用uni.getSystemInfo获取安全区域信息,计算底部安全距离:
uni.getSystemInfo({
  success(res) {
    const safeBottom = res.screenHeight - res.safeArea.bottom
    // 可以调整地图位置或添加底部padding
  }
})
  1. 或者改用H5的window.open方式打开地图URL,避免在WebView中内嵌:
const url = `https://map.qq.com/marker?marker=coord:${item.lat},${item.long};title:${item.mer_name};addr:${item.mer_address}`
window.open(url, '_blank')
回到顶部