openlayers绘制圆形时设置半径以米为单位

ol.geom.Circle半径参数radius单位是什么?

ol.geom.Circle方法有三个参数其中radius便是半径,但是官方文档没有明确说明其单位,只是说radius是number类型,很坑。

ol.geom.Circle设置半径的单位是随投影的单位。

然后继续看api文档发现 setRadius 这个方法是设置图形的半径。然后一句关键的话,官网原话:
Set the radius of the circle. The radius is in the units of the projection.
翻译过来也就是ol.geom.Circle设置半径的单位是随投影的单位。
那么我们就有思路了,就先获取到当前投影然后在获取当前投影的单位,在进行单位转换。

获取当前投影的单位getUnits

在ol.proj.Projection找到getUnits方法可以获取当前投影的单位

投影有哪些单位 ?

Projection units: 'degrees', 'ft', 'm', 'pixels', 'tile-pixels' or 'us-ft'.

ol.proj.Units可以查看有哪些单位,发现其中有'm'就是米这个单位。

单位转换 ?

那么如果将当前投影的单位转换成'm'米呢?
继续寻找api发现在ol.proj.Projection有getMetersPerUnit()方法
Get the amount of meters per unit of this projection.
这样不管当前投影是什么单位都可以设置以米为单位的半径值了。
因为ol.geom.Circle设置半径的单位是随投影的单位,所以需要将单位m转换成投影的单位
到此问题已经解决,代码如下:

/**
* 获取转换后单位的半径
* @param {Number} radius 以米为单位的半径的值
* @returns {Number} circleRadius 以投影的单位为单位的半径的值
*/
let getRadius = (radius)=>{
    let metersPerUnit = map.getView().getProjection().getMetersPerUnit();
    let circleRadius =  radius / metersPerUnit;
    return circleRadius;
}

你可能感兴趣的:(javascript,openlayers,前端)