<view class="wraper">
<map class="map" id="mymap" ref="mymap"
:show-location="true"
:latitude="latitude"
:longitude="longitude"
:scale = "scale"
:markers="cmarks">
</map>
<view class="footer">
<button type="primary" @click="addMarker1">添加QQ</button>
<button type="warn" @click="addMarker2">添加WX</button>
</view>
</view>
</template>
<script>
export default {
data() {
return {
latitude:30.71886,
longitude:103.851805,
scale:13,
markers:[{
id:0,
latitude:30.71886,
longitude:103.851805,
iconPath:"/static/mypos.png"
},{
id:1,
latitude:30.718179,
longitude:103.851261,
iconPath:"/static/potral0.png"
}],
testPoints:[
{longitude:103.853154,latitude:30.716468},
{longitude:103.854654,latitude:30.717081},
{longitude:103.853893,latitude:30.71763},
{longitude:103.853578,latitude:30.718862},
{longitude:103.853147,latitude:30.720182},
{longitude:103.852303,latitude:30.721532},
{longitude:103.85124,latitude:30.721024},
{longitude:103.84932,latitude:30.720756},
{longitude:103.848296,latitude:30.719343},
{longitude:103.847883,latitude:30.718816},
{longitude:103.849485,latitude:30.718018},
{longitude:103.849485,latitude:30.718018},
{longitude:103.851171,latitude:30.715897}
],
qqIndex:0,
wxIndex:0,
mymap:null
}
},
onReady(){
this.mymap = uni.createMapContext("mymap",this);
},
computed:{
cmarks(){
return this.markers
}
},
methods: {
addMarker1:function(){
if(this.qqIndex < this.testPoints.length){
let point = this.testPoints[this.qqIndex];
let markers = this.markers;
let qqId = this.qqIndex+100;
markers.push({
id:qqId,
latitude:point.latitude,
longitude:point.longitude,
iconPath:"/static/qq.png"
});
this.markers = markers;
console.log(this.markers)
this.qqIndex = this.qqIndex+1;
}
},
addMarker2:function(){
if(this.wxIndex < this.testPoints.length){
let point = this.testPoints[this.wxIndex];
let mks = [];
let wxId = this.wxIndex+300;
this.wxIndex = this.wxIndex+1;
mks.push({
id:wxId,
latitude:point.latitude,
longitude:point.longitude,
iconPath:"/static/weixin.png"
});
this.mymap.addMarkers({
markers:mks
});
}
}
}
}
</script>
<style>
.wraper{
flex:1;
}
.map{
flex:1;
}
.footer{
padding: 20rpx 30rpx;
}
</style>
- 发布:2022-01-16 22:06
- 更新:2022-01-17 14:07
- 阅读:379
产品分类: uniapp/App
PC开发环境操作系统: Windows
PC开发环境操作系统版本号: WINDOWS 10
HBuilderX类型: 正式
HBuilderX版本号: 3.3.5
手机系统: Android
手机系统版本号: Android 10
手机厂商: 小米
手机机型: 红米10X PRO
页面类型: nvue
vue版本: vue2
打包方式: 云端
项目创建方式: HBuilderX
示例代码:
操作步骤:
直接运行,点击按钮
直接运行,点击按钮
预期结果:
地图上显示动态添加的marker
地图上显示动态添加的marker
实际结果:
未显示
未显示
bug描述:
项目需要,用 subNVues 展示地图并实时记录运动轨迹,中途会拍照,并把照片显示在运动轨迹上。定义在DATA里面的MARKER能显示,的运行中动态添加到的markers,无法显示,已使用两种方式(直接添加到data-markers数组和使用createMapContext创建的对象调用addMarkers方法)添加,均无法显示。
2 个回复
DCloud_Android_ST
请提供完整示例demo项目 我们这边测试复现下问题
b***@qq.com (作者)
这是完整的APP DEMO