-->

设置围绕城市边界在谷歌地图(Setting Boundaries around city in go

2019-06-24 21:50发布

我正在寻找一种方法来设置围绕谷歌中的特定城市/城镇边界映射使用JavaScript API V3

是这种类型的事情,即使在API中支持?

基本上我不希望我的用户能够越过此地图还那么城市,包括国家区域以移动不只是城市的限制。

Answer 1:

好,你要提供给城市的boundry /镇可以做到的。 你只需要绘制指定城市的boundries的共同坐标折线或多边形。
参观在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));
   });

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



Answer 2:

您需要获得积分全市boundries,那么你就可以创建一个折线。 例如,一个想法可能与此类似:

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
});


Answer 3:

  1. 使用map.fitBounds()map.setCenter()将地图上的城市/国家/地区。
  2. 使用draggable: false选项来禁用平移。


文章来源: Setting Boundaries around city in google maps