在Google Map绘制5米半径圆形：半径转像素方法咨询

1. 直接使用米作为半径（官方推荐） #

Google Maps JavaScript API 的 google.maps.Circle 组件，其 radius 参数本身原生支持米作为单位，你完全不需要手动做米到像素的转换，直接赋值5即可：

const radius = 5; // 单位：米
const myCircle = new google.maps.Circle({
  strokeColor: "#FF0000",
  strokeOpacity: 0.8,
  strokeWeight: 2,
  fillColor: "#FF0000",
  fillOpacity: 0.35,
  map,
  center: myCenter,
  radius: radius,
});

2. 手动计算米转像素（特殊场景需求） #

如果你的业务逻辑确实需要获取当前地图缩放级别下，5米对应的像素长度，可以通过API提供的投影和几何工具计算：

• 利用地图投影将经纬度转换为像素坐标
• 通过球面计算工具生成距离圆心5米的参考点
• 计算两个点的像素差值，得到对应像素半径

示例代码：

// 计算指定米数在当前地图缩放级别下的像素长度
const metersToPixels = (mapInstance, centerLatLng, meters) => {
  const projection = mapInstance.getProjection();
  // 将圆心经纬度转换为基础像素点
  const centerPixel = projection.fromLatLngToPoint(centerLatLng);
  // 生成距离圆心指定米数的参考点（取正东方向，不影响距离计算）
  const offsetLatLng = google.maps.geometry.spherical.computeOffset(centerLatLng, meters, 90);
  // 将参考点转换为像素点
  const offsetPixel = projection.fromLatLngToPoint(offsetLatLng);
  // 根据缩放级别计算实际像素距离
  return Math.abs(offsetPixel.x - centerPixel.x) * Math.pow(2, mapInstance.getZoom());
};

// 调用示例
const radiusInPixels = metersToPixels(map, myCenter, 5);
console.log("5米对应的像素半径：", radiusInPixels);

注意：像素半径会随地图缩放级别变化——缩放级别越高，相同米数对应的像素数越多。

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