Question

I’ve got the following JS:

var map = null;
var center_marker = null;
var zone = null;

$(document).ready(function () {
    if (GBrowserIsCompatible()) {
        convert_address_to_long_lat("1600 Pennsylvania Avenue NW Washington, DC 20500", function (point) { map = create_map(point); map.setCenter(point, 13); alert('test1'); map.addOverlay(center_marker = new GMarker(point)); draw_the_zones(point); });
        //map.setUIToDefault();
    }
});

function create_map(point) {
        var mapOpt = {
            mapTypeId: google.maps.MapTypeId.TERRAIN,
            center: point,
            zoom: 10
        };
        map = new google.maps.Map(document.getElementById("map_canvas"), mapOpt);
}

function convert_address_to_long_lat(address_string,callback) {
    geocoder = new google.maps.Geocoder();
    return geocoder.geocode({ 'address': address_string }, callback);
}

function draw_the_zones(point) {
    zone = new google.maps.Circle({
        radius: 15,
        fillColor: '#FF0000',
        fillOpacity: 0.2,
        map: map
    });
   zone.bindTo('center', center_marker, 'position');
}

I’m using jQuery for the event (btw). I keep getting errors that the position can’t be set as the center of something, it doesn’t say.

Does anybody have any clue on what I am doing wrong?!?

Answer 1

Your callback from geocoder.geocode() isn’t set up to properly work with a GeocoderResults object literal. You’re treating point like a LatLng object instead. Reconstruct your callback provided to convert_address_to_long_lat() to be more like:

function (results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
        var point = results[0].geometry.location;
        map = create_map(point);
        map.setCenter(point, 13);
        alert('test1');
        map.addOverlay(center_marker = new GMarker(point));
        draw_the_zones(point);
    }
}

Notice I check the status of the geocode to see if we were successful, then retrieve the location from the geometry object of the first result. You should be aware that the geocoder can return several potential results from the address string you provide.

For more information about the GeocoderResults object check out the v3 documentation.