Turning weather layer on/off combined with other selections

Question

I tried to implement this code (http://stackoverflow.com/questions/10318316/how-to-hide-or-display-a-google-maps-layer/) on my page, to put the weather/clouds on/off my map, but somehow it interferes with my current code. I tried the two options that were presented in the above link already, but perhaps I did something wrong, or it interferes with the Fusion Tables selections that are already in my map?

Could someone please help me with the right snippet of code? My page is here http://www.strahlen.org/map/mapplusweather.htm. The (de)select buttons are already in the bottom right corner.

Thanks in advance, Frank

ps: although an admin deleted your posting, thanks to Alexander Farber for your previous help!

ps 2: I of course have the weather layer working, see http://www.strahlen.org/map/mapweather.htm, but I cannot toggle it on/off

* final edit * to prevent link-rot: I used the code here in my "production-version" now -> http://www.strahlen.org/map/

Answer 1

I've taken a look at your site and I believe you just have to make some basic changes to your existing code. First, add two new vars within you initialize() function:

function initialize() {
    var tableId = 3167783;
    var cloudDisplayIsOn = false;
    var weatherDisplayIsOn = false;

Then, in your existing cloud click listener code, make these changes:

google.maps.event.addDomListener(document.getElementById('cloud'),
    'click', function() {
        if ( cloudDisplayIsOn ) {
            cloudLayer.setMap( null );
            cloudDisplayIsOn = false;
        }
        else {              
            cloudLayer.setMap( map );
            cloudDisplayIsOn = true;
        }
    });

And finally, in your existing weather click listener code, make very similar changes:

google.maps.event.addDomListener(document.getElementById('weather'),
    'click', function() {
        if ( weatherDisplayIsOn ) {
            weatherLayer.setMap( null );
            weatherDisplayIsOn = false;
        }
        else {
            weatherLayer.setMap( map );
            weatherDisplayIsOn = true;
        }
    });

Now you may have to do a little minor debugging, but I believe this will add the display on/off code for the cloudLayer and the weatherLayer that you need.

Answer 2

I'm trying to perform a similar function, but with a different slant. The following code is the currently used geeToggleLayer function from the fusion_maps_v3.js file which our map server page references. I am trying to eliminate the checkbox toggle in favor of someone simply clicking the layer label to toggle visibility.

    function geeToggleLayer(e, checkBoxId, channel, glmId, layerName) {
      try {
        var cb = document.getElementById(checkBoxId);
        var id = glmId + '-' + channel;

        // toggle layer visibility via clicking checkbox
        try {
          if (cb.checked) {
            geeMap.showFusionLayer(id);
          } else {
            geeMap.hideFusionLayer(id);
          }
        } catch (err2) {
          alert('Failed attempt to enable/disable layer: ' +
                layerName + '\n' + id + '\n' + err2);
        }
      } catch (err) {
        alert('Failed attempt to get checkbox for layer: ' +
              layerName + '\n' + err);
      }
      cancelEvent(e);
    }