2

我正在寻找一种使用 JavaScript 在 Google 地图 API V3 中围绕特定城市/城镇设置边界的方法

API 中是否支持这种类型的东西？

基本上，我不希望我的用户能够在城市范围内更远地浏览地图，包括乡村地区，而不仅仅是城市范围。

4

3 回答 3

2

可以完成您想要提供给城市/城镇的边界。您只需要绘制指定城市边界坐标的折线或多边形。
访问Gmap V3 中叠加层的演示和文档

尝试以下代码来限制用户跨区域平移。

 // Bounds for North America
   var strictBounds = new google.maps.LatLngBounds(
     new google.maps.LatLng(28.70, -127.50), 
     new google.maps.LatLng(48.85, -55.90)
   );

   // Listen for the dragend event
   google.maps.event.addListener(map, 'dragend', function() {
     if (strictBounds.contains(map.getCenter())) return;

     // We're out of bounds - Move the map back within the bounds

     var c = map.getCenter(),
         x = c.lng(),
         y = c.lat(),
         maxX = strictBounds.getNorthEast().lng(),
         maxY = strictBounds.getNorthEast().lat(),
         minX = strictBounds.getSouthWest().lng(),
         minY = strictBounds.getSouthWest().lat();

     if (x < minX) x = minX;
     if (x > maxX) x = maxX;
     if (y < minY) y = minY;
     if (y > maxY) y = maxY;

     map.setCenter(new google.maps.LatLng(y, x));
   });

这将限制用户在北美地区平移

于 2012-05-29T06:47:06.867 回答
2

您需要获取城市边界的点，然后您可以创建折线。例如，一个想法可能与此类似： 

limitCoord = [
    new google.maps.LatLng(42.49956716,-7.019005501),
    new google.maps.LatLng(42.49947126,-7.029286373),
    new google.maps.LatLng(42.50904062,-7.049299123),
    new google.maps.LatLng(42.50722622,-7.069103626),
    new google.maps.LatLng(42.50452387,-7.000150672),
    new google.maps.LatLng(42.49348015,-6.983058917),
    new google.maps.LatLng(42.49843269,-6.971666546),
    new google.maps.LatLng(42.51765791,-6.956909023),
    new google.maps.LatLng(42.52010069,-6.927429186),
    new google.maps.LatLng(42.50992238,-6.914231493),
    new google.maps.LatLng(42.50096695,-6.879679821),
    new google.maps.LatLng(42.48775868,-6.857775832),
    new google.maps.LatLng(43.23907504,-3.293216584)], "#000000", 5);

var boundries = new google.maps.Polyline({
    path: limitCoord,
    strokeColor: "#000000",
    strokeOpacity: 1.0,
    strokeWeight: 2
});
于 2012-05-29T07:38:21.920 回答
1
  1. 使用map.fitBounds()或map.setCenter()使城市/国家/地区在地图上居中。
  2. 使用draggable: false选项禁用平移。
于 2012-05-29T06:40:18.720 回答