uni-app nvue页面中<map>组件markers标记不显示

uni-app nvue页面中<map>组件markers标记不显示

开发环境 版本号 项目创建方式
Windows 3.1.13 HBuilderX
Android Android 11 -
华为 V1914A -

操作步骤：

nvue页面中<map>组件markers标记不显示

预期结果：

nvue页面中<map>组件markers标记显示

实际结果：

nvue页面中<map>组件markers标记不显示

bug描述：

nvue页面中<map>组件markers标记不显示


更多关于uni-app nvue页面中<map>组件markers标记不显示的实战教程也可以访问 https://www.itying.com/category-93-b0.html

10 回复

找到原因了，markers里经纬度如果在data里是静态写入的，可以显示，如果只是动态更改 this.markers[0].经纬度 是不会显示的
markers 需要整体替换 this.markers=新的数组 这样会显示

更多关于uni-app nvue页面中<map>组件markers标记不显示的实战教程也可以访问 https://www.itying.com/category-93-b0.html


太感谢了，整体赋值就可以显示，一个个的push就不行

太感谢了，整体赋值就可以显示，一个个的push就不行

示例demo提供一下

hello uni-app 里的例子不显示

+1，确实不显示 // index.nvue

<map class="map" :style="'height:'+mapheight" v-if="hasqx" :latitude="centerlat" :longitude="centerlong" :markers="markers"></map>

markers:[
// 编辑
{
id:1,
latitude:30,
longitude:96,
title:“我在这”,
iconPath:"…/…/static/images/my.png",
width:24,
height:24,
callout:{
content:“我的当前位置”,
color:’#ff0000’,
fontSize:20,
bgColor:"#ffffff",
padding:8,
display:‘ALWAYS’,
x:0,
y:10
}

                }  
            ]

将页面改为 vue，代码不动，就能显示

这个问题处理了吗，3.2.8版本下，markers不展示，IOS15，android没问题

3.2.9版本，markers不自定图标展示不出来，IOS不可以，android没问题

确实，vue里显示，但nvue里不显示，title在vue里不显示，所以想用nvue试试，结果不行

在nvue中使用<map>组件时，markers不显示通常与样式设置、数据格式或平台兼容性有关。以下是常见排查点：

  1. 样式设置
    确保<map>组件设置了明确的width和height样式（如style="width:750rpx;height:300px;"），避免因尺寸为0导致渲染异常。

  2. markers数据格式
    检查markers数组是否符合规范：

    • 每个标记需包含id、latitude、longitude（数值类型）。
    • 示例：
      markers: [{
  id: 1,
  latitude: 39.909,
  longitude: 116.39742,
  title: "北京"
}]
回到顶部