title: How to turn Google maps layers on and off with check boxes?
body: <p>I'm trying to add toggeble traffic, cloud and weather layers to Google maps using check boxes. However when I try to do so all of the layers disappear no matter if the boxes were checked or unchecked. I've never done anything like this in Javascript and I'm really new to Javascript so I have no idea what I'm doing wrong. Here is my code, any help will be great!</p>
  
  <p>Javascript: </p>
  
  <pre><code>        function check() 
      {
          var weatherLayer = new google.maps.weather.WeatherLayer({
          temperatureUnits: google.maps.weather.TemperatureUnit.FAHRENHEIT
          });
          var trafficLayer = new google.maps.TrafficLayer();
          var cloudLayer = new google.maps.weather.CloudLayer();
  
          if(document.getElementById('weather').checked)
  
          {weatherLayer.setMap(map);}
  
          else if(!document.getElementById('weather').checked)
  
          {weatherLayer.setMap(map);}
  
          cloudLayer.setMap(map);
  
          trafficLayer.setMap(map);
      }
  </code></pre>
  
  <p>Html</p>
  
  <pre><code>        &lt;label&gt;&lt;input type="checkbox" id="weather" checked="checked" onclick="check()" /&gt;Weather&lt;/label&gt;
          &lt;label&gt;&lt;input type="checkbox" id="clouds" onclick="check()" /&gt;Clouds&lt;/label&gt;
          &lt;label&gt;&lt;input type="checkbox" id="traffic" onclick="check()" /&gt;Traffic&lt;/label&gt;
  </code></pre>