如何使用LatLng数据放大LatLngBounds框 [英] How do I enlarge LatLngBounds box using LatLng data

问题描述

  map.getBounds（）
 
我通过调用google map来获取当前的界限。 code> 

这将返回LatLngBounds。例如：



 （（ -  26.574013562724005，-1.53​​75947819336488），（-25.230016040794602,3.735842718066351））
  

如果我想将地图边界增加一个百分比（例如1％），是否有可能获得新的LatLng点地图中心。

我试着用1.01乘以每个坐标，但是这会改变地图，并且不会增加边界。

我希望使用增加的框大小来启动缓存标记，以便在用户平移或缩小时保存对服务器的调用。

下面的图片将更好地解释需要发生的事情：

解决方案

基于 markerclusterer getExtendedBounds 函数你可以使用这个：

pre $函数getExtendedBounds（map，overlay）{
//使用_mapBoundsEnlargePixels我们添加一些地图周围的额外空间
//更改此值直到获得所需的大小
var _mapBoundsEnlargePixels = 500;

var projection = overlay.getProjection（）;
var bounds = angular.copy（map.getBounds（））;

//将界限转换为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（））;

//将点转换为像素并延伸出
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;

//将像素点转换回LatLng
var ne = projection.fromDivPixelToLatLng（trPix）;
var sw = projection.fromDivPixelToLatLng（blPix）;

//扩展边界以包含新边界。
bounds.extend（ne）;
bounds.extend（sw）;

返回界限;
}


I get the current bounds of a google map by calling:

map.getBounds()

This will return LatLngBounds. For example:

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

Is it possible to get the the new LatLng points if I want to increase the map bounds by a percentage (e.g. 1%) around the centre of the map.

I have tried multiplying every coordinate by 1.01 but this shifts the map and does not increase the bounds.

I want to use the increased box size to start caching markers, in order to save calls to the server when the user pans or zooms out.

The image below will explain better what needs to happen:

解决方案

Based on markerclusterer getExtendedBounds function you could use this one:

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;
}

这篇关于如何使用LatLng数据放大LatLngBounds框的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！