Search code examples
javascriptgoogle-mapsgoogle-maps-api-3google-maps-markersgoogle-geocoder

Google maps API Searching postcodes in a specific country


I'm trying to set a Post Code in order to get Lat and Long Coordinates and place a marker on it. Until now, everything is fine.

The problem comes when I give a postcode input and it ends up making a marker somewhere in another part of the world.

Ex: I type 2975-435 and I get : https://maps.googleapis.com/maps/api/geocode/json?address=2975-435&key=YOURKEY

"formatted_address" : "Balbey Mahallesi, 435. Sk., 07040 Muratpaşa/Antalya, Turquia",

And I want to make this postcode only be searched in Portugal.

https://maps.googleapis.com/maps/api/geocode/json?address=2975-435+PT This way I get:

"formatted_address" : "2975 Q.ta do Conde, Portugal",

Exactly what I wanted.

The problem is, how do I make this in JS code? Here is the code I have till now

function codeAddress () {
    var lat = '';
    var lng = '';
    var address = document.getElementById("cp").value;
    geocoder.geocode( { 'address': address},

    function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            lat = results[0].geometry.location.lat();
            lng = results[0].geometry.location.lng();
            //Just to keep it stored
            positionArray.push(new google.maps.LatLng(lat,lng));
            //Make the marker
            new google.maps.Marker({
                position:new google.maps.LatLng(lat,lng),
                map:map
            });

        }else {
            alert("Geocode was not successful for the following reason: " + status);
        }
    });
}

Thank you


Solution

  • To restrict a result to certain country you can apply a component filtering:

    https://developers.google.com/maps/documentation/javascript/geocoding#ComponentFiltering

    So, your JavaScript code will be

    function codeAddress () {
        var lat = '';
        var lng = '';
        var address = document.getElementById("cp").value;
        geocoder.geocode( { 
            'address': address,
            componentRestrictions: {
                country: 'PT'
            }
        },
    
        function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                lat = results[0].geometry.location.lat();
                lng = results[0].geometry.location.lng();
                //Just to keep it stored
                positionArray.push(new google.maps.LatLng(lat,lng));
                //Make the marker
                new google.maps.Marker({
                    position:new google.maps.LatLng(lat,lng),
                    map:map
                });
    
            }else {
                alert("Geocode was not successful for the following reason: " + status);
            }
        });
    }
    

    You can see a component filtering in action using the Geocoder tool:

    https://developers-dot-devsite-v2-prod.appspot.com/maps/documentation/utils/geocoder/#q%3D2975-435%26options%3Dtrue%26in_country%3DPT%26nfw%3D1

    Hope it helps!