谷歌地图API v3圈覆盖问题

Google Maps API v3 Circle Overlay Issues

本文关键字：覆盖 问题 v3 API 谷歌地图      更新时间：2023-09-26

如果您能提供以下帮助，我将不胜感激。我使用的JS代码在http://jsfiddle.net/jpEwM显示一个谷歌地图与一个可调整大小的圆叠加输出中心点坐标，半径和边界框。

这工作得很好，但是有一些额外的功能，我无法在不破坏代码的情况下集成:

  1. 我想在叠加的中心输出地名以及它的坐标

  2. 在地图上移动时很容易丢失圆形覆盖。我希望能够使圆圈覆盖始终在视口中可见(即，如果你滚动地图足够远，失去圆圈覆盖，它会"跳"回视口的中心，或者更好的光标位置)。

  3. 如果你放大地图，你可以完全在圆圈覆盖内结束。是否有可能在缩放时调整圆圈覆盖的大小，这样就不会发生这种情况?

  4. 当我从XML文件向地图添加标记时，它会破坏当前功能的其余部分。理想情况下，我想使用MarkerClusterer来做到这一点，但基本的标记也会很好。

对不起，有这么多的点-我已经为这个烦恼了好几个星期了!

许多谢谢。

回答第3点:

您需要为绑定更改添加侦听器:

google.maps.event.addListener(map, 'bounds_changed', function() {
    displayInfo(distanceWidget,map);
});
请注意，我已经在displayInfo方法中添加了一个map参数，现在看起来像这样: 
function displayInfo(widget, map) {
    var info = document.getElementById('info');
    info.innerHTML = 'Position: ' + widget.get('position') + '<br />' + 'Distance: ' + widget.get('distance') + '<br />' + 'Bounds: ' + widget.get('bounds') +'<br/>Map bounds: '+ map.getBounds();
}

通过此更改，您将看到可以确定distanceWidget的边界何时超过地图的边界，并采取必要的步骤来减小小部件的直径。

我的优秀jsFiddle的分支(其中包括上述更改)在这里:http://jsfiddle.net/bhofmann/AT8uz/

相关文章：