Search code examples
javascriptgoogle-mapsdomgoogle-maps-api-3google-fusion-tables

My Google Map Fusion Layer doesn't load when I add a new event?


I have a custom Google Maps Fusion Layer and I am trying to add a checkbox that once it is clicked will switch to a new Fusion Layer on the map.

However, when I add in a new Google Events DomListener to do this, not only does it not work but my original map now no longer loads and I cannot figure out why?

google.maps.event.addDomListener(document.getElementById('houseChoropleth'),
  'click', function() {
  var houseMap = document.getElementById('houseChoropleth');
  layer.setOptions({
  query:{
  select: "col40>>0"",
  from: '16NkOpQVdCaNu8jo1Wvhk8x2LcXBXhyY4dPowkhQ' }
    });
    });

}

My current Javascript code can be viewed here: http://jsfiddle.net/VD9LN/1/

I am using the sample code provided by Google here as a reference on how to implement it: https://developers.google.com/fusiontables/docs/samples/heatmap

Though I changed the heatmap section so it generates my new Layer.

(the changeMap_0 function in my code is for my search bar and works)


Solution

  • You have an extra " in your query:

    google.maps.event.addDomListener(document.getElementById('houseChoropleth'),
      'click', function() {
        var houseMap = document.getElementById('houseChoropleth');
        layer.setOptions({
          query:{
            select: "col40>>0"",
            from: '16NkOpQVdCaNu8jo1Wvhk8x2LcXBXhyY4dPowkhQ' 
          }
        });
      });
    
    }
    

    this modified version works for me

    with checkbox