title: Filter markers with multiple data attributes on Google Maps API
body: <p>I tried to make filters for a Google Map API based on the data attributes given to the markers. I made an example on <a href="https://codepen.io/robvkb/pen/QWbjPXr" rel="nofollow noreferrer">CodePen</a>. Every marker has (in this example) two data attribute:</p>
  
  <ol>
  <li>type_po</li>
  <li>denominatie</li>
  </ol>
  
  <p>Now the problem is that the filters work separately, but I can't combine two filters. E.g. When you check 'SBO' and 'Katholiek', you should only see one marker, but instead you see every marker with either the attribute SBO or the attribute Katholiek.</p>
  
  <p>So my question is: what changes needs to be made so that only the marker(s) appear that are the same as the checked checkboxes combined?</p>
  
  <pre><code>/*
  Marker Filter
  */
  
  filterMarker = function (id) {
  for (i = 0; i &lt; map.markers.length; i++) {
      marker = map.markers[i];
  
      if (document.getElementById(id).checked) {
          if (marker.type_po == id) {
              marker.setVisible(true);
          }
      }  else {
          if (marker.type_po == id) {
              marker.setVisible(false);
          }
      }
      if (document.getElementById(id).checked) {
          if (marker.denominatie == id) {
              marker.setVisible(true);
          }
      }  else {
          if (marker.denominatie == id) {
              marker.setVisible(false);
          }
      }
  
  }
  </code></pre>
  
  <p>}</p>