谷歌地图在 LatLng.toUrlValue 中返回经度 >180答案

【问题标题】：Google Maps returning longitude >180 in LatLng.toUrlValue谷歌地图在 LatLng.toUrlValue 中返回经度 >180
【发布时间】：2012-08-23 21:35:31
【问题描述】：

我正在构建一个带有叠加多边形的全球地图。它位于 jQuery Accordion 中。每当我切换手风琴窗格然后回到地图时，它就会跳到南极洲。为了克服这种行为，我一直在尝试捕获当前中心 LatLng，将其存储在一个变量中，然后在返回地图的手风琴面板时 setCenter()。

它不起作用，所以我尝试使用 .toUrlValue() 方法将当前中心坐标转储到页面上的可见元素。当我向东或向西平移地图时，经度数不断增加。我预计它会达到 180，然后重置为 -180。

我的代码：

var currMapCenter = null;

jQuery(document).ready(function() {
  jQuery("#accordion").bind('accordionchange', function(event, ui) {
    if (ui.newContent.attr('id') == 'region-list')
    {
    triggerMapResize(); 
    }
});
});

function initialize_map() {

//do all the initialization here...

currMapCenter = map.getCenter(); //set initial center in variable.

google.maps.event.addListener(map, 'center_changed', function() {
  currMapCenter=map.getCenter();
  jQuery("#description").html(currMapCenter.toUrlValue());//to see what is happening...
});
}

function triggerMapResize()
{
google.maps.event.trigger(map, "resize");
map.setCenter(currMapCenter);
}

documentation 表示 getCenter() 返回一个 LatLng，而 setCenter() 需要一个 LatLng。我是否误解了当我尝试设置 currMapCenter = map.getCenter() 时会发生什么？鉴于我的地图需要像现在一样换行，我如何捕获可用的 LatLng 以与 setCenter() 一起使用？

【问题讨论】：

标签： javascript jquery google-maps-api-3

【解决方案1】：

getCenter() 返回 LatLng，但它可能超过 180 度。这取决于您将地球绕其轴旋转多少次。 :)

我找到了解决这个问题的简单方法

var loc=map.getCenter();
loc=new google.maps.LatLng(loc.lat(), loc.lng(), false);

现在 LatLng 被重新计算为正确的值，您可以使用它...

【讨论】：

这很好用。太糟糕了，您不能只将 wrap 标志传递给 getCenter 并跳过这个，但是哦，好吧

【解决方案2】：

Map object getCenter 方法记录了该行为

getCenter()
纬度
返回显示在地图中心的位置。请注意，此 LatLng 对象未包装。有关详细信息，请参阅 LatLng。

也许您可以使用 getBounds()（如果地图被缩小以显示多个副本，可能无法正常工作）

getBounds()
纬度边界
返回当前视口的纬度/经度边界。如果世界的多个副本可见，则范围的经度范围为 -180 到 180 度（含）。

【讨论】：

我在 Map 对象部分看到了这一点，但不明白将它重新分配给地图时意味着什么“未包装”。我试图找到一种方法将其包裹起来（-180 到 180），但也许这并不重要。我认为是 jQuery 操作在切换手风琴窗格时使地图中心关闭。
显示后在地图上触发“resize”事件不起作用？文档说“调整大小 - 当 div 更改大小时，开发人员应在地图上触发此事件：google.maps.event.trigger(map, 'resize')。”隐藏地图时实际上是在更改地图的大小。
resize 事件解决了我最初的地图仅部分绘制的问题（如another SO topic 中所述。）即使在此之后，它也没有保留中心位置。我昨晚找到了一个解决方案，当我准备好相关代码时会发布它。
LatLng 构造函数有一个可选参数包装，你可以获取你得到的坐标并用它们创建一个 LatLng 对象，将 true 作为可选参数传递

【解决方案3】：

现在看来，这个主题的标题不准确，与实际问题无关。 IE8 - 毫不奇怪 - 给了我各种各样的问题并且根本无法绘制地图，而符合标准的浏览器很好，除了在切换手风琴窗格时失去中心。

在我的原始代码中，我正在监听“center_changed”事件以捕获当前地图中心坐标。我开始怀疑 jQuery 的事件是否在手风琴关闭时改变了地图的位置，所以我将中心捕获事件切换为“mouseout”。这解决了问题，但我仍然不知道是什么原因造成的。

旁注：我一直在使用 window.onload = function () { initialize_map(); } 在 IE 以外的浏览器中成功，但 IE 卡住并且根本无法加载。

var map=null;
var currMapCenter = null;

jQuery(document).ready(function() {
jQuery("#accordion").bind('accordionchange', function(event, ui) {
if (ui.newContent.attr('id') == 'region-list')
{
if(map==null) {
//first load; call map initialization
initialize_map();
}
triggerMapResize(); 
}
});

function initialize_map() {

//do initilization here...

google.maps.event.addListener(map, 'mouseout', function() { 
currMapCenter=map.getCenter();
});
}

function triggerMapResize() {
google.maps.event.trigger(map, "resize");
map.setCenter(currMapCenter);
}

上面的代码没有问题；在 Firefox 14、Chrome 和 IE8 中测试。

【讨论】：

【解决方案4】：

谢谢，这个帖子帮助了我。这是我用来验证 noWarp 设置并在坐标不超过 +/- 180 度的情况下访问我需要的中心的代码：-

var gmap_center = new google.maps.LatLng(map.getCenter().lat(), map.getCenter().lng(), false);

console.log('GMap lat/lng with default noWrap:true = ' + map.getCenter().lat() + ' / ' + map.getCenter().lng());

console.log('GMap lat/lng with noWrap:false = ' + gmap_center.lat() + ' / ' + gmap_center.lng());

【讨论】：