javascript - 如何使用 LatLng 数据放大 LatLngBounds 框

标签 javascript html google-maps google-maps-api-3

我通过调用获取谷歌地图的当前边界:

map.getBounds()

这将返回 LatLngBounds。例如:

((-26.574013562724005, -1.5375947819336488), (-25.230016040794602, 3.735842718066351))

如果我想将 map 中心周围的 map 边界增加一定百分比(例如 1%),是否可以获得新的 LatLng 点。

我尝试将每个坐标乘以 1.01,但这会移动 map 并且不会增加边界。

我想使用增加的框大小来开始缓存标记,以便在用户平移或缩小时保存对服务器的调用。

下图将更好地解释需要发生的事情:

enter image description here

最佳答案

基于markerclusterer getExtendedBounds 函数,您可以使用这个:

function getExtendedBounds(map, overlay) {
    //With _mapBoundsEnlargePixels we add some extra space surrounding the map
    //change this value until you get the desired size
    var _mapBoundsEnlargePixels = 500;

    var projection = overlay.getProjection();
    var bounds = angular.copy(map.getBounds());

    // Turn the bounds into latlng.
    var tr = new google.maps.LatLng(bounds.getNorthEast().lat(),
        bounds.getNorthEast().lng());
    var bl = new google.maps.LatLng(bounds.getSouthWest().lat(),
        bounds.getSouthWest().lng());

    // Convert the points to pixels and extend out
    var trPix = projection.fromLatLngToDivPixel(tr);
    trPix.x = trPix.x + _mapBoundsEnlargePixels;
    trPix.y = trPix.y - _mapBoundsEnlargePixels;

    var blPix = projection.fromLatLngToDivPixel(bl);
    blPix.x = blPix.x - _mapBoundsEnlargePixels;
    blPix.y = blPix.y + _mapBoundsEnlargePixels;

    // Convert the pixel points back to LatLng
    var ne = projection.fromDivPixelToLatLng(trPix);
    var sw = projection.fromDivPixelToLatLng(blPix);

    // Extend the bounds to contain the new bounds.
    bounds.extend(ne);
    bounds.extend(sw);

    return bounds;
}

关于javascript - 如何使用 LatLng 数据放大 LatLngBounds 框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28704994/

相关文章:

javascript - Meteor框架中的全局对象UI是什么以及如何使用它?

javascript - 吊装工程

html - 构建一个简单的 HTML5/canvas 2D 游戏。游戏引擎推荐使用?

html - 如何修复导航中下拉菜单的对齐方式

Android - 测试谷歌地图信息窗口点击

javascript - 如何对异步映射函数执行递归

javascript - 如何使用 javascript(无 jQuery)动画滚动到页面顶部?

php - 删除内联样式php中的样式宽度图像

c# - 如何在谷歌地图上添加路线方向?

javascript - 如何在加载 google.maps.OverlayView 派生类之前等到 google maps API 加载完毕