高德地图使用setFitView()方法导致区域地图等级不一致问题

最近一个项目使用到高德地图主要实现的功能是进入页面默认选中某个城区,城区下面划分很多街道,选择街道下拉框选择街道,让街道自适应到地图大小,而放大地图的按钮也是让街道自适应到地图大小,导致点击选择街道,自适应后,放大地图功能就没什么变化也失去作用(本身也是自适应)。而且每个街道区域的自适应地图等级大小各不相同。

  •  解决的方法是点击街道使它自适应地图大小,并同时获取自适应地图等级的大小,使用getZoom(),然后setZoom()当前地图等级减1,地图放大按钮自适应就有效果,缩小就再次自适应并获取地图等级再次减1.具体代码如下:

 设置下拉框街道点击缩放自适应小一级地图等级

if($('.map-scale-refresh div:nth-child(2)').hasClass('street') || $('.map-scale-refresh div:nth-child(2)').hasClass('click') ){		
			map.setFitView(polygonArr);		
	}else {
		    map.setFitView(polygonArr); 
			var zoom = map.getZoom();
			map.setFitView(polygonArr,null,null,zoom - 1); 				
	}	 		
  • 地图放大功能 
if(!$(this).hasClass('zoom')) {
		if(streetName == "全部街道" || streetName == ""){	
				map.setFitView();
				var zoom = map.getZoom();
				map.setZoom(zoom + 1); 							
		}else{
            map.add(polygonArr);
			map.setFitView(polygonArr); 			
		}
  • 地图缩小功能
if(streetName == "全部街道" || streetName == ""){
			if($('.map-scale-refresh div:nth-child(2)').hasClass('click')){
				map.setFitView(); 
				var zoom = map.getZoom();
				map.setZoom(zoom + 1);
			}else{
				map.setFitView();			
			}
				
		}else{
          if($('.map-scale-refresh div:nth-child(2)').hasClass('click')){
				map.add(polygonArr);
				map.setFitView(polygonArr);
			}else {
				map.add(polygonArr);
				map.setFitView(polygonArr);
				var otherZoom = map.getZoom();
				map.setFitView(polygonArr,null,null,otherZoom - 1); 
			}
		}

    其中 polygonArr.push(polygon); polygon为多边形覆盖物

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值