MapboxGL与supercluster聚类半径（像素转米）转换方法及JS函数需求

要把Mapbox GL中的像素聚类半径转换成米，核心是利用Web墨卡托投影的地面分辨率——不同纬度和缩放级别下，每个像素对应的实际地面距离是不同的，我们可以通过边界框的中心纬度来计算这个比值，再完成转换。

核心计算公式 #

1. 先将纬度转换为弧度：纬度弧度 = 纬度 * Math.PI / 180
2. 计算该纬度在当前缩放级别下的地面分辨率（单位：米/像素）：

   地面分辨率 = 156543.03392 * Math.cos(纬度弧度) / Math.pow(2, 缩放级别)
   

   其中156543.03392是Web墨卡托投影在缩放级别0时，赤道上的地面分辨率（1像素对应约156.5公里）。
3. 像素半径转米：米半径 = 像素半径 * 地面分辨率

JavaScript实现函数 #

假设你的边界框格式为[minLng, minLat, maxLng, maxLat]（Mapbox GL常用格式），以下是直接可用的函数：

function pixelRadiusToMeters(pixelRadius, zoom, bbox) {
    // 从边界框取中心纬度
    const centerLat = (bbox[1] + bbox[3]) / 2;
    // 转换为弧度
    const latRad = centerLat * Math.PI / 180;
    // 计算地面分辨率
    const groundResolution = 156543.03392 * Math.cos(latRad) / Math.pow(2, zoom);
    // 转换为米
    return pixelRadius * groundResolution;
}

注意事项 #

• 若你的边界框跨度极大（比如跨多个纬度带），用中心纬度计算会有一定误差，此时建议改用聚类区域的实际中心纬度来提升精度。
• 这个计算是基于Web墨卡托投影的特性，和Mapbox GL的投影体系完全匹配，能保证和前端聚类逻辑的一致性。

内容的提问来源于stack exchange，提问作者hifichevymane