【问题标题】:Google Maps API v3 set zoom level to show a given radius?Google Maps API v3 设置缩放级别以显示给定的半径?
【发布时间】:2026-02-06 06:00:01
【问题描述】:

我创建了一张地图,用户在其中输入邮政编码和半径(英里),我希望地图以邮政编码创建的点为中心,并且仅显示(大致)该半径内的区域。我正在创建一个带有半径的圆,并试图让地图适合该圆。现在它正确居中,但显示的区域比给定的半径要大。

me.center_map = function(latlng, r)
{
    // latlng is the point of the zipcode
    var circ = new google.maps.Circle();
    circ.setRadius(r * 1609.0);
    circ.setCenter(latlng);
    map.setCenter(latlng);
    map.fitBounds(circ.getBounds());

    // updates markers
    google.maps.event.trigger(map,'dragend');
};

编辑:画出我正在使用的圆圈。理想情况下,地图会放大到半径内的区域。

【问题讨论】:

    标签: javascript google-maps


    【解决方案1】:

    对 fitBounds() 的调用将缩放到完全包含边界的最小缩放级别。如果您要再放大 1 个缩放级别,则半径将不会完全包含在地图中。

    【讨论】:

    • 是的,你需要一些可以呈现部分缩放级别的东西,例如而不是 z=11 你需要 z=11.5
    • syslogic:我意识到这一点。我的意思是谷歌地图需要能够呈现浮点缩放级别。
    【解决方案2】:
    map.setZoom(map.getZoom() + 1);
    

    这取决于特定半径的拟合程度(以防它并不总是相同)。要显示圆圈内的区域,需要构建一个矩形,其角在圆圈的周长上,并使地图的视口适合它的边界。例如。绘制一个可见的圆形和一个具有相同中心点的透明矩形应该按照操作描述的那样工作。

    【讨论】:

      【解决方案3】:

      自 2017 年 6 月起,fitBounds 方法有了第二个参数,表示填充的大小。想要去掉的,只需要传0即可。

      Map.map.fitBounds(bounds, 0);
      

      新方法签名:

      fitBounds(bounds:LatLngBounds|LatLngBoundsLiteral, padding?:number)
      

      【讨论】:

        最近更新 更多