Question

Today I was tasked with working with the Google API for the first time to create a map. I had no problem setting up the map on my site, and that was easy enough. But for some reason my points I coded with json are not showing up. It is saying that my gmap object is undefined. I could really use some help here, I’ve been starring at this thing ALL DAY!!

function load () {
    var map = document.getElementById("map");
    if (GBrowserIsCompatible()) {
        var gmap = new GMap2(map);
        gmap.addControl( new GSmallMapControl() );
        gmap.addControl( new GMapTypeControl()) ;
        gmap.addControl( new GOverviewMapControl(new GSize(100,100)) );
        gmap.setCenter( new GLatLng(42.3313889, -83.0458333), 7 );
    } else {
        alert("Sorry, your browser cannot handle the true power of Google Maps");
    }
}

window.onload = load;
window.onunload = GUnload;

function createMarker(input) {
    var marker = new GMarker(input.point);
    GEvent.addListener(marker, "click", function() {
        marker.openInfoWindowHtml( input.walkName + input.date + input.address );
    });
    return marker;
}

function parseJson (doc) {
    var jsonData = eval("(" + doc + ")");
    for (var i = 0; i < jsonData.markers.length; i++) {
        var marker = createMarker(jsonData.markers[i]);
        gmap.addOverlay(marker);
        }
}

GDownloadUrl("points.json", function(data, responseCode) {
    parseJson(data);
});

Answer 1

It looks like gmap is defined within the scope of the load function. So it’s not available in the parseJSON function where you reference it.