Skip to content Skip to sidebar Skip to footer
Home / Google Maps / Javascript

Google Maps - Postcode Plotting

Post a Comment
I'm struggling to find any up to date relevant information on how to achieve this effect in google maps. I was hoping someone knows more than me on the subject and could point me i

Solution 1:

This code will tell you the single closest zipcode to the one you enter in the box. I'm sure from here you can adapt it to give the top 5 results.

I was able to adapt the Geocoding sample code:

<!DOCTYPE html><html><head><metaname="viewport"content="initial-scale=1.0, user-scalable=no"/><metahttp-equiv="content-type"content="text/html; charset=UTF-8"/><title>Google Maps JavaScript API v3 Example: Geocoding Simple</title><linkhref="http://code.google.com/apis/maps/documentation/javascript/examples/standard.css"type="text/css" /><scripttype="text/javascript"src="http://maps.google.com/maps/api/js?sensor=false"></script><scripttype="text/javascript">var geocoder;
    var map;
    var markers = [];
    functioninitialize() {
        geocoder = new google.maps.Geocoder();
        var latlng = new google.maps.LatLng(40.768505,-111.853244);
        var myOptions = {
            zoom: 8,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
        addPostCode('84101');
        addPostCode('84102');
        addPostCode('84103');
        addPostCode('84104');
        addPostCode('84105');
    }

    functionaddPostCode(zip) {
        geocoder.geocode( { 'address': zip}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK)
        {
            map.setCenter(results[0].geometry.location);
            var marker = new google.maps.Marker({
            map: map,
            position: results[0].geometry.location,
            name: zip
        });
        markers.push(marker);
        } else {
            alert("Geocode was not successful for the following reason: " + status);
        }
        });
    }

    functioncheckZip(zip)
    {
        var distance = Number.MAX_VALUE;
        var index = 0;
        geocoder.geocode( { 'address': zip}, function(results, status)
        {
            if (status == google.maps.GeocoderStatus.OK)
            {
                for(ix=0; ix< markers.length; ix++)
                {
                    var tmp = getDistance(results[0].geometry.location, markers[ix].position);
                    if (tmp < distance)
                    {
                        distance = tmp;
                        index = ix;
                    }
                }
                alert('nearest zipcode is :' + markers[index].name);
            }
        });
    }

    functiongetDistance(latlng1, latlng2)
    {
        var R = 6371; // Radius of the earth in kmvar dLat = (latlng2.lat()-latlng1.lat()) * Math.PI / 180;  // Javascript functions in radiansvar dLon = (latlng2.lng()-latlng1.lng()) * Math.PI / 180;
        var a = Math.sin(dLat/2) * Math.sin(dLat/2) +
            Math.cos(latlng1.lat()  * Math.PI / 180) * Math.cos(latlng2.lat()  * Math.PI / 180) *
            Math.sin(dLon/2) * Math.sin(dLon/2);
        var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a));
        var d = R * c; // Distance in km
        d = d * 0.621371192; // convert to milesreturn d;
    }
</script></head><bodyonload="initialize()"><div><inputid="address"type="textbox"value=""><inputtype="button"value="Geocode"onclick="checkZip(getElementById('address').value)"></div><divid="map_canvas"style="height:90%"></div></body></html>

You may like these posts

Post a Comment for "Google Maps - Postcode Plotting"