uni-app map 官方示例代码在 ios 和 H5 中 markers 不显示，安卓显示正常

uni-app map 官方示例代码在 ios 和 H5 中 markers 不显示，安卓显示正常

项目信息 详细信息
产品分类 uniapp/App
PC开发环境 Windows
PC开发环境版本 windows10
HBuilderX类型 正式
HBuilderX版本 3.1.4
手机系统 iOS
手机系统版本 iOS 13.4
手机厂商 苹果
手机机型 iphone xs max
页面类型 nvue
打包方式 云端
项目创建方式 HBuilderX

示例代码：

<template>  
    <view>  
        <view class="page-body">  
            <view class="page-section page-section-gap">  
                <map style="width: 100%; height: 300px;" :latitude="latitude" :longitude="longitude" :markers="covers">  
                </map>  
            </view>  
        </view>  
    </view>  
</template>  

<script>  
    export default {  
        data() {  
            return {  
          id:0, // 使用 marker点击事件 需要填写id  
                title: 'map',  
                latitude: 39.909,  
                longitude: 116.39742,  
                covers: [{  
                    latitude: 39.909,  
                    longitude: 116.39742,  
                    iconPath: '../../static/CAR.png'  
                }, {  
                    latitude: 39.90,  
                    longitude: 116.39,  
                    iconPath: '../../static/CAR.png'  
                }]  
            }  
        },  
        methods: {  

        }  
    }  
</script>

操作步骤：

  1. 以上代码 真机运行

预期结果：

安卓和ios和H5都能正常显示markers

实际结果：

真机运行只有安卓可以正常显示，ios和H5均不能显示marker

bug描述：

uniapp map组件 ios和h5中不显示markers 安卓可以正常显示， 代码用的是官方示例的代码，详情见图


更多关于uni-app map 官方示例代码在 ios 和 H5 中 markers 不显示，安卓显示正常的实战教程也可以访问 https://www.itying.com/category-93-b0.html

10 回复

顶顶顶 ! 来人呀~ 上个月还是好好的可以正常显示的，突然ios就不显示markers了，拿官方示例代码也不显示！！救救孩子吧

更多关于uni-app map 官方示例代码在 ios 和 H5 中 markers 不显示，安卓显示正常的实战教程也可以访问 https://www.itying.com/category-93-b0.html


回复 DCloud_UNI_Anne: 还有，ios的map组件带箭头的线 arrowLine 设置无效，之前也是正常的

回复 DCloud_UNI_Anne: 你好！请问这个bug什么时候才能修复好呀？

up up up up

路过的兄弟姐妹们~帮忙顶一下呀~

1.marker不显示的问题是因为 id 是必传项，最新版本对重复的id做了优化，id缺失默认不会显示，把id设置一下就好了； 2.自定义箭头图标不显示的问题确认为bug，HX 3.1.6+ 版本已修复此问题；

你好，我想问一下，ios的map组件带箭头的线 arrowLine，在新版本真机运行是可以的，但是打包出来线条还是不显示箭头，这是什么情况？ 打包用的是云打包

回复 河马哥0522: 解决了吗？

没有解决吧，我用本地图片ios可以显示，但是网络图片还是不能显示

这是一个已知的uni-app地图组件平台差异问题。在iOS和H5平台，marker的显示需要特别注意以下几点：

  1. iconPath路径问题：iOS和H5对相对路径的解析与Android不同。建议使用绝对路径，将图标放在static目录下并使用/static/开头的路径。

  2. marker id配置：每个marker对象必须包含唯一的id字段，iOS平台对此要求更严格。

  3. 图标尺寸适配：iOS对图标尺寸有特定要求，建议使用2x、3x倍图以确保在不同分辨率设备上正常显示。

修改后的markers配置示例：

covers: [{
    id: 1,
    latitude: 39.909,
    longitude: 116.39742,
    iconPath: '/static/CAR.png'
}, {
    id: 2,
    latitude: 39.90,
    longitude: 116.39,
    iconPath: '/static/CAR.png'
}]
回到顶部