Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

Is there an easy way to plot a location on a Google map using an address specified in a custom field?

For example, if a post has the following address specified;

1600 Pennsylvania Avenue, NW Washington, DC 20500

A Google map will automatically be displayed on the page with with a marker on this exact location?

Surely it can't be that difficult.

I've looked at the API but nothing sprung out at me

share|improve this question
add comment

1 Answer 1

up vote 2 down vote accepted

Dean, your best bet is to do it through JS on the front end.

I use the following function to covert the postcode to a Lat and Lng:

function codeAddress(address){
    geocoder.geocode({
        'address': address
    }, function(results, status){
        if(status == google.maps.GeocoderStatus.OK){
            map.setCenter(results[0].geometry.location);
            map.setZoom(16);

            var marker = new google.maps.Marker({
                map: map,
                position: results[0].geometry.location
            });

            markersArray.push(marker);      

            // BA Lng, za Lat 

            //console.log(results[0].geometry.location['Ba']);

            document.getElementById("_supplier_maplatlong").value = results[0].geometry.location;

        }else{
            alert("Postcode not found");
        }
    });
}

Then just drop in the postcode in to a hidden input or something and do something along the lines of:

if($('#_supplier_postcode').val()){
        codeAddress($('#_supplier_postcode').val());
    }

Once you've initialize() obviously.

share|improve this answer
    
I'm guessing that #_supplier_postcode would be the custom field name? Sorry, jQuery really isn't my strong suit –  Dean Elliott Dec 5 '11 at 9:59
    
Yes, also the _supplier_maplatlong would be the map id on the page. –  Alex Older Dec 5 '11 at 11:11
    
I've tried using this method but I keep getting errors (Or more specifically, the page doesn't even appear). I'm clearly doing something wrong somewhere... –  Dean Elliott Dec 5 '11 at 12:37
    
Are you getting any errors logged in the console? –  Alex Older Dec 5 '11 at 13:15
    
Nope, it's one of those errors where no content loads at all. Viewing the source code just brings up a blank page –  Dean Elliott Dec 5 '11 at 13:38
show 2 more comments

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.