【报Bug】nvue开发地图时，点击标注后title不显示；设置callout后，点击后无法隐藏

分类：nvue

map nvue bug已修复

HBuilderX2.6.16.20200424
安卓手机红米note2 Android5.0.5
macOS Mojave 10.14.5
直接运行到手机后有几个问题

marker中存在title且不存在callout时，点击marker后，title并没有显示
设置callout，点击marker，展示callout后，再点点击后，无法隐藏callout;
- 点击marker时无法再次触发markertap，只会触发callout；
- 在callouttap中，移除对应marker中的callout对象，callout依然不会隐藏

//问题2去掉代码中的注释即可  
<template>  
    <view>  
        <map style="width: 750rpx; height: 640px;"  
        id="mapId"  
        :latitude="latitude"  
        :longitude="longitude"  
        :scale="12"  
        :markers="covers"  
        :circles="circles"  
    :show-location="true"  
    @callouttap="oncallouttap"  
    @markertap="onmarkertap">  
        </map>  
    </view>  
</template>  
<script>  
export default {  

  data() {  
    return {  
      title: 'map',  
      latitude: 34.366338,  
      longitude: 108.779437,  
      radius: 5000,  
      scale: 12,  
      circles: [  
      ],  
      markers: [  
        {  
          id: 1,  
          latitude: 34.351515,  
          longitude: 108.745616,  
          title: 'title11111',  
          iconPath: '/static/logo.png',  
          width: 20,  
          height: 20  
          // callout: {  
          //   content: 'content11111',  
          //   color: 'red',  
          //   fontSize: 40,  
          //   borderRadius: 5,  
          //   bgColor: '#ffa',  
          //   padding: 10,  
          //   display: 'BYCLICK',  
          //   textAlign: 'left'  
          // }  
        },  
        {  
          id: 2,  
          latitude: 34.379878,  
          longitude: 108.806115,  
          title: 'title22222',  
          iconPath: '/static/logo.png',  
          width: 60,  
          height: 60  
          // callout: {  
          //   content: 'content2222',  
          //   color: 'blue',  
          //   fontSize: 40,  
          //   borderRadius: 5,  
          //   bgColor: '#ffa',  
          //   padding: 10,  
          //   display: 'BYCLICK',  
          //   textAlign: 'left'  
          // }  
        }  
      ]  
    };  
  },  
  methods: {  
    oncallouttap(e) {  
      console.log('oncallouttap', e);  

      // const index = this.markers.findIndex(item => item.id == e.detail.markerId);  
      // const newMarkers = [...this.markers].map((item, i) => {  
      //   if (i !== index) return item;  
      //   const {callout, ...props} = item;  
      //   return {...props};  
      // });  
      // this.markers = newMarkers;  
      // console.log('this.markers', this.markers);  
    },  
    onmarkertap(e) {  
      console.log('onmarkertap', e);  
    }  
  }  
};  
</script>  

<style lang="less">  

</style>

nvue-map.zip

2020-04-25 17:35 负责人:DCloud_Android_ST 分享

4 个回复

1***@qq.com

大佬想问怎么能在 @markertap调用的函数里面获取到点击的id啊，
onmarkertap(e) {
console.log('onmarkertap', e);
}
这么写为什么我返回的是undefined的啊

DCloud_uniAD_HDX

marker 对象没设置 id 吧

2020-04-28 15:26
1***@qq.com

回复 DCloud_uniAD_HDX: 谢谢大佬！问题已经解决了，但是现在有了新的问题！！！图片引用动态加载的图片不显示！而且设置的width和height都不起作用，请问是什么原因呢！

2020-05-12 01:34
1***@qq.com

回复 DCloud_uniAD_HDX: 忘记说了，是安卓端！h5网页没啥问题，运的都挺好的

2020-05-12 01:47
1***@qq.com

回复 1***@qq.com: 我又发现一个bug！安卓端的markers里的title设置后也不生效。。。无比感谢官方爸爸，辛苦尽快解决这个bug，特别是图片加载和宽高设置那个！！！毕设展示着急用55555

2020-05-12 01:52
DCloud_uniAD_HDX

回复 1***@qq.com: title 需要点击后显示，宽高不生效吗？没有复现这个问题

2020-05-12 18:58
1***@qq.com

回复 DCloud_uniAD_HDX: 嗯就是点击不显示title，最关键的是我的图片是从服务器上加载的，也不显示...存在本地的图片显示但是宽高是不生效的。这些问题都是云打包后安卓真机运行的时候发现的，h5是正常的！

2020-05-16 17:35
1***@qq.com

回复 1***@qq.com: 我把运行截图和代码放在评论的链接里了，辛苦官方爸爸了！希望能够尽快解决555

2020-05-16 20:35
1***@qq.com

回复 DCloud_uniAD_HDX: 我把bug的运行截图和代码放在评论的链接里了，辛苦官方爸爸了！希望能够尽快解决555

2020-05-18 20:02