How to get Google Maps API to set the correct zoom level for a country?

后端 未结 4 607
长情又很酷
长情又很酷 2020-11-28 02:30

Is there a was of automatically setting the zoom level based on the size of the country that the map has been centered on?

maps.google.com does exactly what I need,

相关标签:
4条回答
  • 2020-11-28 03:09

    If you don't want to use the geocoder client from google, because of usage limitations you could use your own list. You can get one from this github repo.

    Here is a code example using jQuery's getJSON function and google maps API v3:

        function initialize() {
          // read the list of countries
         $.getJSON('countries.json', function (countries) {
    
             // will use the country with index 40 (Cyprus)
             var index_country = 40;
             var myOptions = {
                 center: new google.maps.LatLng(
                     countries[index_country].center_lat,
                     countries[index_country].center_lng),
             }
             var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    
             // set the bounds of the map
             var bounds = new google.maps.LatLngBounds(
                 new google.maps.LatLng(countries[index_country].sw_lat, countries[index_country].sw_lng),
                 new google.maps.LatLng(countries[index_country].ne_lat, countries[index_country].ne_lng) );
    
             map.fitBounds(bounds);
         });
     }
    
    0 讨论(0)
  • 2020-11-28 03:12

    For API v3 check this answer.

    You can use the Google Maps Client-side Geocoder to get the bounding box of the country, as in the following example:

    // API version 2
    var geocoder = new GClientGeocoder();
    
    geocoder.getLocations("Russia", function (locations) { 
    
        var north = locations.Placemark[0].ExtendedData.LatLonBox.north;
        var south = locations.Placemark[0].ExtendedData.LatLonBox.south;
        var east  = locations.Placemark[0].ExtendedData.LatLonBox.east;
        var west  = locations.Placemark[0].ExtendedData.LatLonBox.west;
    
        var bounds = new GLatLngBounds(new GLatLng(south, west), 
                                       new GLatLng(north, east));
    
        map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds));
    });
    
    // API version 3
    // ... set north, south, east and west ...
    var bounds = new google.maps.LatLngBounds(new google.maps.LatLng(south, west), 
                                              new google.maps.LatLng(north, east));
    map.fitBounds(bounds);
    

    The screenshots below show the results of the above technique when searching for Russia and Cuba:

    Zoom on Russia and Cuba

    0 讨论(0)
  • 2020-11-28 03:16

    If you don't use google maps api and just use their geocoding you can use this formula:

    var url = 'http://maps.google.com/maps/geo?q=YOUR_QUERY&output=json&oe=utf8&sensor=false&key=YOUR_KEYback=geoCodeDone';
    jQuery.getScript(url);
    
    
    function geoCodeDone(data)
    {
        if (data.Status.code == 200)
        {
            lng = data.Placemark[0].Point.coordinates[0];
            lat = data.Placemark[0].Point.coordinates[1];
    
            var east  = data.Placemark[0].ExtendedData.LatLonBox.east;
            var west  = data.Placemark[0].ExtendedData.LatLonBox.west;
    
            var zoom = 11 - Math.round(Math.log(Math.abs(west-east))/Math.log(2));
        }
    }
    
    0 讨论(0)
  • 2020-11-28 03:19

    For V3 this code worked for me:

    var geocoder = new google.maps.Geocoder();
       geocoder.geocode( { 'address': address}, function(results, status) {
          if (status == google.maps.GeocoderStatus.OK) {
            map.setCenter(results[0].geometry.location);
            map.fitBounds(results[0].geometry.viewport);
          }
        });
    
    0 讨论(0)
提交回复
热议问题