为了账号安全,请及时绑定邮箱和手机立即绑定

点击某一个Marker,然后样式更改。怎样让非点击的Marker样式回复原状?

点击某一个Marker,然后样式更改。怎样让非点击的Marker样式回复原状?

幕布斯6054654 2019-04-11 14:15:54
最近在捣鼓腾讯地图,然后,产品经理要求——Marker的状态有2种,选中和未选中。当我点击其中一个标注的时候,样式就更替的选中样式,如果之前有选中的就恢复成未选中样式。尝试了几种我所想的办法,都不行;开发文档上也没有。特来求助各位,如果这能实现,该怎么实现?最好有代码可以让我参考一下~        const latlngs = [];     const test = [];     let datas;     if (this.allProjects) {       datas = this.allProjects;       for (let j = 0; j < this.allProjects.length; j++) {         latlngs.push(new qq.maps.LatLng(this.allProjects[j].maLat, this.allProjects[j].maLng));         test.push(new qq.maps.LatLng(this.allProjects[j].maLat, this.allProjects[j].maLng));       }     }     for (let i = 0; i < latlngs.length; i++) {       // 判断,以便显示不一样的图标       if (this.allProjects[i].hasParkingLot()) {         let marker = new qq.maps.Marker({           icon: noSelectedIcon,           position: latlngs[i],           map: this.map         });         qq.maps.event.addListener(marker, 'click', () => {           infoWin.open();           infoWin.setContent('<div style="text-align:center;white-space:' +               'nowrap;margin:10px;font-size:0.2rem;">这是' +               datas[i].maName + '</div>');           infoWin.setPosition(latlngs[i]);           this.map.panTo(latlngs[i]);  // 移动地图中心           this.selectedProject = datas[i];           // debugger           this.markerSelect = marker;           marker.setIcon(selectedIcon);         });       }       }        就是这样子,按照腾讯地图给的API以及示例方法,我将坐标组里面的点都循环显示出来,于是,         每一个点击的marker都是点击到的单个信息并不是好几个含在其中。但是,每次一更改图标设置marker.setIcon都是一次性修改全部,无语了。      这种怎么破解?
查看完整描述

5 回答

?
轩轩轩轩轩

TA贡献1条经验 获得超0个赞

你说中国的这些技术论坛,有多少一样的帖子?这应该就是技术发展不如别人的原因吧,提问是抄的,就连回答都是抄的?

查看完整回答
反对 回复 2021-04-15
?
湖上湖

TA贡献2003条经验 获得超2个赞

设置一个变量保存下来之前改变的marker的id和样式,在点击新marker的事件时让旧的marker也改变


查看完整回答
反对 回复 2019-05-13
?
慕尼黑的夜晚无繁华

TA贡献1864条经验 获得超6个赞

如果是点击切换其他已经是选中的,你直接设置this.markerSelect记录住的上一个marker setIcon还原就行了

查看完整回答
反对 回复 2019-05-13
  • 5 回答
  • 0 关注
  • 844 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号