显示隐藏高德地图点标注的文本标签「建议收藏」

全栈程序员站长

发布于 2022-08-27 07:16:19

2.8K00

代码可运行

文章被收录于专栏：全栈程序员必看全栈程序员必看

运行总次数：0

代码可运行

大家好，又见面了，我是你们的朋友全栈君。

@[显示隐藏高德地图点标注的文本标签] 效果如图

如下代码是百度地图通用的方法，显示隐藏文本标签，但是用在高德地图上不起作用，网上百度无果

hideMarkTitle: function(status) {
					var markers = this.map.getOverlays();
					for(var i = 0; i < markers.length; i++) {
						if(markers[i].toString() == "[object Marker]") {
							if(markers[i].getLabel() != null) {
								markers[i].getLabel().setStyle({
									display: status
								});
							}
						}
					}
				},

最后使用了如下的方法将文本标签置为空，而后如果想显示文本标签，就将地图上的点标注全部移除，重新调用一遍地图插入点标注的方法（this.fetchState()），虽然阿解决了目前的需求，但是感觉这样不太好，如果地图上的点标注过多，可能会导致APP卡顿

hideMarkTitle: function(status) {
					if(status == "none"){
						for (var i = 0; i < this.markers.length; i++) {
									this.markers[i].setLabel({
										content:"",
									});
								}
					}else{
						this.map.remove(this.markers);
						this.fetchState();
					}
					
					
				},