标记在Google Maps API v3上不受限制

Question

我正在使用Google Maps API v3来显示世界地图，这是静态的（它不允许缩放或拖动）。在它上面有一个带有自定义图标的可拖动标记，以及一组与其绑定的不同半径的圆圈。

实际的地图代码是：

    var myLatlng = new google.maps.LatLng(28.283, 13.843);
    var mapOptions = {
      zoom: 2,
      maxZoom:2,
      minZoom:2,
      draggable: 0,
      center: myLatlng,
      streetViewControl: false,
      disableDefaultUI: true,
      mapTypeId: google.maps.MapTypeId.SATELLITE,
    };

    map = new google.maps.Map(document.getElementById("mapaGoogle"),
      mapOptions);

    var markerImage = new google.maps.MarkerImage('path/to/imageplaneminiature.png',
    new google.maps.Size(40, 40),
    new google.maps.Point(0, 0),
    new google.maps.Point(18, 20));

    marker = new google.maps.Marker({
      map: map,
      position: myLatlng,
      icon: markerImage,
      draggable: true
    });

然后对于每个圈子我都是：

    planes[1] = new google.maps.Circle({
      map: map,
      radius: 2500000,
      strokeColor: "#cccccc",
      fillOpacity: 0
    });

    planes[1].setMap(map);
    planes[1].bindTo('center', marker, 'position');

这样做很好，但我有两个问题：

1）当用户将标记拖到边框附近时，由于世界是圆形的，半径也显示在另一侧。但它没有在它的风景中显示标记，并且看起来并不那么酷。看图片：

2）如果用户将标记拖出地图区域，它将保持不可见状态，并且用户无法将其恢复。它有什么方法可以强制它在视口区域内？

Answer 1

AFAIK没有选项可以选择是否在较低的缩放级别重复标记。可拖动的标记：将重复虚假。

为了防止用户将标记拖动到地图边界之外，我可以考虑的是检查标记位置是否适合地图边界，如果超出界限则将其移回最后位置。

您可以执行类似

的操作

if (map.getBounds().contains(marker.getPosition())) {
    // marker is within map bounds
}

http://jsfiddle.net/upsidown/c4gaC/

请注意，如果您想阻止用户缩放地图，您还必须设置以下两个选项：

scrollwheel: false
disableDoubleClickZoom: true

修改

这是重复标记的 hack 。它在可拖动的标记下方绘制一个不可拖动的标记，在拖动开始时隐藏它并在拖动停止时再次显示它。这样你的标记就会重复。

http://jsfiddle.net/upsidown/m76km/

请注意，这会导致2个问题：

1. 两个显示的标记中只有一个是可拖动的，这显然令人困惑。
2. 如果使用具有透明度的PNG标记图标，这将导致一些显示问题。

不透明度不会成为圆圈的问题，因为您只能将其绑定到两个标记中的一个。