Question

Well I’m having a couple problems getting google maps to work using the v3 API.

Look here: [Removed by Poster]

Both maps are, in fact, working but the zoom level seems like it is random. The zoom is set to 12 when the map is initialized. Also, if you click on the marker, the description box is missing corners and is unable to be closed. Here is the javascript functions I am using to activate these maps:

var mapHash = [];
var bound = new google.maps.LatLngBounds();
finishedCoding = false;
function initMap(map_container_div,lat,lng) {
    var latlng = new google.maps.LatLng(lat,lng);
    var myOptions = {
        zoom:12,
        center:latlng,
        mapTypeId:google.maps.MapTypeId.ROADMAP,
        streetViewControl: false
    };

    var map = new google.maps.Map(document.getElementById(map_container_div), myOptions);
    if (!getMap(map_container_div)) {
        var mapInfo = {
            mapkey:'',
            map:'',
            geocoder : new google.maps.Geocoder()
        };
        mapInfo.map = map;
        mapInfo.geocoder = new google.maps.Geocoder();
        mapInfo.mapKey = map_container_div;
        mapHash.push(mapInfo);
    }
}

function placeMarker(myAddress, mapId, description, title) {
    mapIndex = getMap(mapId)
    //alert(myAddress + mapId + map)
    mapHash[mapIndex].geocoder.geocode({
        'address':myAddress
    }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            mapIndex = getMap(mapId)
            var marker = new google.maps.Marker({
                map:mapHash[mapIndex].map,
                position:results[0].geometry.location,
                title: title
            });
            bound.extend(results[0].geometry.location);
            mapHash[mapIndex].map.fitBounds(bound);

            finishedCoding = true;
            placeDesc(marker,description,mapId);

        }
    });
}

function placeDesc(marker,myDesc,mapId) {
    mapIndex = getMap(mapId);
    var infowindow = new google.maps.InfoWindow({
        content: myDesc
    });
    google.maps.event.addListener(marker, 'click', function() {
      infowindow.open(mapHash[mapIndex],marker);
    });
}

function getMap(mapKey) {
    for (var i = 0 ; i < mapHash.length ; i++) {
        if (mapHash[i].mapKey == mapKey) {
            return i;
        }
    }
    return false;
}

function startmap(mapidd,address,description,title,lat,lng) {
    initMap(mapidd,lat,lng)
    placeMarker(address,mapidd,description,title)
}

Answer 1

I solved this issue myself and am kicking myself for not thinking of this. 🙂

Just had to add mapHash[mapIndex].map.setZoom(12);

And I removed the following 2 codes:

bound.extend(results[0].geometry.location);
mapHash[mapIndex].map.fitBounds(bound);