Search code examples
javascriptgoogle-mapsgoogle-maps-api-3google-maps-api-2

Country specific zoom level in Google Maps API


I'm trying to make a Google Map that only shows the Netherlands. But when I use zoom level 6 it shows Belgium and Germany as well and when I use zoom level 7 it zooms too far in that it doesn't show the complete country.

How can I make The Netherlands show only, and not germany and belgium (or at least a very tiny part of them).

Currently it looks something like this:

enter image description here


Solution

    1. go to http://www.gadm.org/download, download the adm0 file for the Netherlands

    2. Combine that polygon (as the inner ring(s)) with a polygon that covers the whole earth

    3. use the winding reversal tool to reverse any inner polygons that don't wind opposite the outer ring.

    4. zip up the resulting kml, rename to kmz. Display on the map using geoxml3

    Code:

    function initialize() {
        var map = new google.maps.Map(
        document.getElementById("map_canvas"), {
            center: new google.maps.LatLng(85.4419, -122.1419),
            zoom: 13,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        });
        var geocoder = new google.maps.Geocoder();
        var geoXml = new geoXML3.parser({
                        map: map,
                        zoom: false, 
                     });
        geoXml.parse("http://www.geocodezip.com/geoxml3_test/kmz/nld_adm0_inverted.kmz");
        google.maps.event.addListener(geoXml,'parsed', function() {
          geocoder.geocode( { 'address': "Netherlands"}, function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
              map.fitBounds(results[0].geometry.viewport);
            } else {
              alert("Geocode was not successful for the following reason: " + status);
            }
          });    
        })
    }
    google.maps.event.addDomListener(window, "load", initialize);
    

    Working example

    Example of map

    To restrict it to be always displayed on the map see this page from Mike Williams' v2 tutorial

    working example