如何在鼠标拖动选择的区域内获取标记？

Question

简介
我想找到位于通过在地图上拖动鼠标创建的矩形区域内的所有标记。任何 jQuery 插件或其他东西是否支持此功能？如果没有，我想在我的项目中实现它。我觉得会很酷。

详情
我正在使用 Google Maps v2，因为我想在我的项目中支持 IE 6。

我是 Maps 的初学者，经历了Developer's guide section 和一些基本演示和其他 SO 问题。

到目前为止，这是我的想法 -

• 用户单击地图控制部分中的“选择区域”按钮。这会调用 disableDragging() 并且用户已准备好进行选择。 （可能是http://code.google.com/apis/maps/documentation/javascript/v2/controls.html#Custom_Controls 给出了一些想法）

• 然后用户进行区域选择。记下选择起点和选择终点，并假设它们是矩形的两个对角，找到其中的标记。但是，到目前为止，我没有看到任何工作代码来获取点击点的坐标。我想最好使用纬度/经度作为坐标而不是实际的 x-y 坐标。这个问题Google Maps API using jQuery Plugin: How to get a marker's latitude and longitude on click? 讨论了在单击它时获取标记的纬度/经度，但我还没有成功尝试过。

总结
这是我的问题 -

• 如何在地图上显示矩形选择区域？ （外观一般呈浅灰色透明）

• 如何获取点击点的纬度/经度（纬度/经度），然后将其扩展得到选择起点和终点的纬度。

我对 jQuery 有经验，如果有一些不错的 jQuery 插件解决方案，请告诉我。我看到了10 jQuery Plugins for Easier Google Map Installation 的列表，但不确定这些列表是否能帮助我满足我的要求。

当我有标记列表时，我想在单独的显示部分中填充一些相关信息，以便每次用户选择一些标记时，相应的信息都会显示在显示部分中。那部分应该更容易。

谢谢

Answer 1

您可以查看Google Maps API Demo Gallery 下的KeyDragZoom 示例以实现矩形选择功能。你可以找到文档here。

对于第二个问题，您可以使用GLatLngBounds 类及其containsLatLng(latlng:GLatLng) 函数。通过将您的 GLatLngBounds 对象设置为矩形的边界，您可以使用 containsLatLng 函数针对它测试您的标记。

如果您决定使用 KeyDragZoom，向 getDragZoomObject 添加一个 dragend 侦听器将为您提供一个 GLatLngBounds 对象，您可以使用该对象通过 containsLatLng 函数测试您的标记。

map.enableKeyDragZoom();
var dz = map.getDragZoomObject();
GEvent.addListener(dz, 'dragend', function (bnds) {
  // test your markers against bnds here
});