show postal code/zip code bounds on google map

Question

I would like to mark the outline (bounds) of a postal code on a map. With google maps API, I can send a postal code or address and get back log/lat, then place a icon on a map. Now I would like to make a box or polygon around the entire area covered by the postal code. Is there an API or method to do this? I could use google maps or other service if available.

Api to get lat/lon of postal code...

if (geocoder)           {       
    geocoder.geocode({ 'address': address }, function (results, status) {                  
        if (status == google.maps.GeocoderStatus.OK){
            var pcode = results[0].address_components[0].long_name;
            var latitude = results[0].geometry.location.lat();
            var longitude = results[0].geometry.location.lng();                 
        }
    }

score 1 · Answer 1 · answered Feb 29 '12 at 02:27

geocoder.geocode({ 'address': address }, function (results, status) {

    if (status == google.maps.GeocoderStatus.OK) {

        var pcode = results[0].address_components[0].long_name;
        var latitude = results[0].geometry.location.lat();
        var longitude = results[0].geometry.location.lng();

        //do whatever you want above then call the displayBounds function
        displayBounds(results[0].geometry.bounds);
    }
});

function displayBounds(bounds) {

    var rectangleOptions = {
        strokeColor: '#0000ff',
        strokeOpacity: 0.5,
        strokeWeight: 3,
        bounds: bounds
    }

    var rectangle = new google.maps.Rectangle(rectangleOptions);

    rectangle.setMap(map); //map being your google.maps.Map object
}

This way you can display the bounds on the map. Make sure you get the geometry.bounds on your results though, since it's not always the case.

This actually produces a rectangle. At least in the Netherlands, it does. I wish to make the bounds for a polygon of a postal code, try `3335, NL`, any idea how to acomplish this? — Gerard Nijboer, Sep 15 '12 at 16:44
No. I don't believe you can get this kind of information from Google Maps API. All you will get is a global bounds area in which the location you searched for would fit. Have a look at the official documentation: https://developers.google.com/maps/documentation/javascript/geocoding More info here: http://stackoverflow.com/questions/9491114/google-maps-api-v3-geocoder-results-issue-with-bounds — MrUpsidown, Sep 23 '12 at 16:48

score 0 · Answer 2 · edited Nov 28 '19 at 12:04

DisplayZipCodeArea(results[0].geometry.bounds, resultsMap);

function DisplayZipCodeArea(bounds, resultsMap) {

    var rectangleOptions = {
        strokeColor: '#0000ff',
        strokeOpacity: 0.5,
        strokeWeight: 3,
        bounds: bounds
    }

    var rectangle = new google.maps.Rectangle(rectangleOptions);

    rectangle.setMap(resultsMap); //map being your google.maps.Map object
}

show postal code/zip code bounds on google map

2 Answers2