Setting Boundaries around city in google maps

后端 未结 3 1718
生来不讨喜
生来不讨喜 2021-01-03 16:27

I\'m looking for a way to set boundaries around a specific city/town within the Google maps API V3 using JavaScript

Is this type of thing even supported within the A

相关标签:
3条回答
  • 2021-01-03 16:34

    You need to get the points for boundries of the city, then you can create a polyline. For example, one idea could be similar to this:

    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
    });
    
    0 讨论(0)
  • 2021-01-03 16:37
    1. Use map.fitBounds() or map.setCenter() to center the city/country/region on the map.
    2. Use draggable: false option to disable panning.
    0 讨论(0)
  • 2021-01-03 16:51

    well the boundry that you want to provide to the city/ town can be done. you just need to draw the polylines or polygons specifying the co ordinates of the boundries of the city.
    visit demos and documentation for overlays in Gmap V3

    try the following code to restrict user to pan across the region.

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

    this will restrict user to pan across region of north america

    0 讨论(0)
提交回复
热议问题