百度地图设置圆形覆盖物最佳视角

本文介绍了一种根据圆形覆盖物的直径计算百度地图最佳视角缩放层级的方法,通过算法自动调整地图显示范围,优化用户体验。

在百度地图中可以根据一组坐标点设置地图的最佳视角,但是针对只有一个中心点坐标的圆形覆盖物却没有提供设置最佳视角的API方法,只能自己另外实现,实现思路是根据圆形遮盖物的直径算出对应的地图缩放层级。

下面的表格是每个层级对应的距离比例,从最高层往下推可以得出的规律是每下一级对应的比列大约是上一级的两倍,例:
18级≈19级x2
17级=18级x2
16级=17级x2
15级≈16级x2
14级=15级x2
13级=12级x2

级别比例尺
19级20m
18级50m
17级100m
16级200m
15级500m
14级1km
13级2km
12级5km
11级10km
10级20km
9级25km
8级50km
7级100km
6级200km
5级500km
4级1000km
3级2000km
2级5000km
1级10000km
初始实现代码:
	let diameter = 1000; //圆直径
    let zoom = 20; //地图层级数(百度地图默认为19级,这里多加1级方便下面通过直径的运算得出地图对应的层级)
    let num = 20; //尺寸基数,对应19级的20m


	/* 从最高级往下推,基数每次乘以2后的值还在圆直径的范围内则zoom减去一级,循环类推 */
    while (num < diameter) { 
        num = num * 2;
        zoom--;
    }
    console.log(zoom); //14
最终代码如下:

因圆形覆盖物设置的是半径,为了方便计算参数使用半径,最终在设置zoom时加了2级,优化显示效果。

/**
 * 设置圆覆盖物最佳视角
 * @param {Point} point 百度坐标点对象
 */
setCircleBestViewport(point, radius) {
    let zoom = 20; //地图层级数(百度地图默认为19层,这里多加1层使下面通过直径的运算刚好可以得出地图对应的层级)
    let num = 20; //基数
    let diameter = radius *2;  //直径
    while (num < radius) {
        num = num * 2;
        zoom--;
    }
    map.centerAndZoom(point, zoom + 2); //设置中心点和缩放层级,为了优化显示效果此处zoom多加2级
}
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值