Google地图自动填充功能和边界

Hel*_*nar 2 google-maps

我想要仅来自墨西哥的自动完成结果,为此我正在尝试下面的代码并添加边界以确保将墨西哥放在一个矩形中,但是我仍然从国外获得resutlts.

我怎样才能解决这个问题 ?

这是html,相同的代码如下:

<!DOCTYPE html>
<html>
  <head>
    <title>Google Maps JavaScript API v3 Test: Places Autocomplete</title>
    <script src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places"
      type="text/javascript"></script>

    <style type="text/css">
      body {
        font-family: sans-serif;
        font-size: 14px;
      }
      #map_canvas {
        height: 1px;
        width: 1px;
        display:hidden;
      }
     #searchTextField{
        width:500px;
    }
    </style>

    <script type="text/javascript">
      function initialize() {

        var options = { 
          bounds: google.maps.LatLngBounds( google.maps.LatLng(33.1613, -118.4766), google.maps.LatLng(14.3770, -84.8145) )     
        };

        var input = document.getElementById('searchTextField');
        var autocomplete = new google.maps.places.Autocomplete(input, options);

        var infowindow = new google.maps.InfoWindow();

        google.maps.event.addListener(autocomplete, 'place_changed', function() {
          infowindow.close();
          var place = autocomplete.getPlace();

        });
      }
      google.maps.event.addDomListener(window, 'load', initialize);
    </script>
  </head>
  <body>
      <input id="searchTextField" type="text" size="50"> <div id="map_canvas"></div>
  </body>
</html>
Run Code Online (Sandbox Code Playgroud)

小智 8

现在,您可以通过以下方式实现目标:

    componentRestrictions: {country: 'mx'}
Run Code Online (Sandbox Code Playgroud)

在你的options参数中构建Autocomplete对象.

与此不同,这是一个严格的限制bounds.这只适用于国家,但无论如何这都是你想要的.