Google Maps Checkbox Filter

by grant

HTML

<script src="https://maps.googleapis.com/maps/api/js?v=3&amp;ext=.js"></script>
<div class="map_wrap">
    <div class="siderbarmap">
        <ul>
            <input id="monumentoCheckbox" type="checkbox" onclick="toggleGroup('monumento')" checked="checked"></input>
            <input id="museusCheckbox" type="checkbox" onclick="toggleGroup('museus')" checked="checked"></input>
            <input id="restaurantesCheckbox" type="checkbox" onclick="toggleGroup('restaurantes')" checked="checked"></input>
            <input id="hotelCheckbox" type="checkbox" onclick="toggleGroup('hotel')" checked="checked"></input>
        </ul>
    </div>
    <div id="map" style="width:100%;height:585px; z-index: 1;"></div>
</div>

CSS

html, body, #map, #map_wrap {
    height: 100%;
    width:100%;
}

JavaScript

function xmlParse(str) {
    if (typeof ActiveXObject != 'undefined' && typeof GetObject != 'undefined') {
        var doc = new ActiveXObject('Microsoft.XMLDOM');
        doc.loadXML(str);
        return doc;
    }

    if (typeof DOMParser != 'undefined') {
        return (new DOMParser()).parseFromString(str, 'text/xml');
    }

    return createElement('div', null);
}
var infoWindow = new google.maps.InfoWindow();
var customIcons = {
    monumento: {
        icon: 'http://maps.google.com/mapfiles/ms/icons/blue.png'
    },
    hotel: {
        icon: 'http://maps.google.com/mapfiles/ms/icons/green.png'
    },
    restaurantes: {
        icon: 'http://maps.google.com/mapfiles/ms/icons/yellow.png'
    },
    museus: {
        icon: 'http://maps.google.com/mapfiles/ms/icons/purple.png'
    }
};

var markerGroups = {
    "museus": [],
        "monumentos": [],
        "restaurantes": [],
        "hotel": []
};

function load() {
    var map = new google.maps.Map(document.getElementById("map"), {
        center: new google.maps.LatLng(38.639104, -8.210413),
        zoom: 12,
        mapTypeId: 'roadmap'
    });
    var infoWindow = new google.maps.InfoWindow();



    map.set('styles', [{
        zoomControl: false
    }, {
        featureType: "road.highway",
        elementType: "geometry.fill",
        stylers: [{
            color: "#ffd986"
        }]
    }, {
        featureType: "road.arterial",
        elementType: "geometry.fill",
        stylers: [{
            color: "#9e574f"
        }]
    }, {
        featureType: "road.local",
        elementType: "geometry.fill",
        stylers: [{
            color: "#d0cbc0"
        }, {
            weight: 1.1
        }

        ]
    }, {
        featureType: 'road',
        elementType: 'labels',
        stylers: [{
            saturation: -100
        }]
    }, {
        featureType: 'landscape',
        elementType: 'geometry',
        stylers: [{
            hue: '#ffff00'
        }, {
            gamma:...