Google Maps V3 fitBounds on visible markers

Question

Finding it hard to get clear information on this but what I am trying to achieve is fitBounds on visible markers.

The Array defines the title, category, lat/long and hre

Answer 1

On first thought you would think you could use a bounds object and keep track of what is visible. But since you are also hiding markers and you can't remove a coordinate from the bounds, that wouldn't work.

I think the best option would be to show/hide required markers, then loop through all of them and add them to a new bounds object if visible. Then fitbounds to that.

function fitVisibleMarkers() {
    var bounds = new google.maps.LatLngBounds();
    for(var m in markers) {
        if (markers[m].getVisible()) {
            bounds.extend(markers[m].getPosition());
        }
    }
    map.fitBounds(bounds);
}

$("#activities .checkbox").click(function(){
    var cat = $(this).attr("value");
    if ($(this).is(":checked")) {
        show(cat);
    } else {
        hide(cat);
    }
    fitVisibleMarkers();
});