title: Ordering / z-indexing overlays on Google Map
body: <p>I'm adding 2 overlays - a <a href="https://developers.google.com/maps/documentation/business/demographics" rel="nofollow">Demographics Layer</a> and a <a href="https://developers.google.com/maps/documentation/javascript/layers#FusionTables" rel="nofollow">Fusion Tables Layer</a> - to a Google Map. The problem is that I need to order these layers so the Fusion Tables Layer is always on top of the Demographics Layer. It seems that whichever one I call "setMap(map)" on last is on top, but I have functionality for toggling the Demographics Layer on or off using setMap(null) and setMap(map)... but whenever it is toggled on using setMap(map), it shows up on top of the Fusion Tables Layer.</p>
  
  <pre><code>if (checkbox.checked) {
    demolayer.setMap(map);  //added on top
  } else {
    demolayer.setMap(null);
  }
  </code></pre>
  
  <p>Is there another way to order overlays besides making sure you call setMap(map) on the layer you want on top last? I've tried z-index properties with no luck. Any help is much appreciated.</p>