使用 jQuery 在 Google 地图上的空闲事件答案

【问题标题】：idle event on Google-maps with jQuery使用 jQuery 在 Google 地图上的空闲事件
【发布时间】：2011-09-15 08:09:15
【问题描述】：

我在我的网站中设置了一个谷歌地图，并且我想在地图的边界发生变化（通过拖动或缩放）时重新加载标记。

我最初是使用jQuery添加地图并清除标记：

$('#map_canvas').gmap();
$('#map_canvas').gmap('clear', 'markers');

然后，添加标记：

$('#map_canvas').gmap('addMarker', {'position': position, 'bounds': true });

我的问题：如何“捕捉”移动地图的事件？我已经读到有空闲事件，I saw an example:

google.maps.event.addListener(map, 'idle', function() {
});

但是我放置的任何东西而不是“map”变量都不起作用...... 我也试过了：

map = new google.maps.Map(document.getElementById("map_canvas"));

有人有想法吗？

非常感谢，

丹尼

【问题讨论】：

能否请您提供一些有关您正在使用的 gmap jquery 插件的信息；那里似乎有一对。

标签： jquery events google-maps

【解决方案1】：

对于遇到此问题的其他人：

您可以像这样获取地图对象/变量：

$('#map_canvas').gmap();
var map = $('#map_canvas').gmap('get', 'map');

一旦你有了地图对象，你就可以给它附加事件监听器：

$(map).addEventListener('idle', function() {
    console.log('Map is now idle');
    console.log(map.getCenter());
});

HTH

【讨论】：

【解决方案2】：

在你定义的函数中，你可以做任何你想做的事情。它总是被称为地图边界变化。例如：

google.maps.event.addListener(map, 'idle', function() {
 var bounds = map.getBounds();
 var sw = bounds.getSouthWest();
 var ne = bounds.getNorthEast();
 alert("minimum lat of current map view: " + sw.lat());
});

“地图”应该是您之前创建的谷歌地图。

var map = new google.maps.Map( document.getElementById('map_canvas'), myOptions );

干杯！托马斯

【讨论】：

这不是解决方案，OP可以绑定事件，因为他没有map变量，因为他使用了jquery.gmap插件。