title: In Fusion Tables, can a gradient be set via the Google Maps Javascript-based API?
body: <p>This is my code below. For some reason, the only style that render properly are the stroke (it's white) and the opacity (set at 0.4). However, my gradient doesn't seem to load. Instead, it's all red. Why is this?</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
      &lt;meta charset="UTF-8"&gt;
  
      &lt;title&gt;Customizing Fusion Tables map using Fusion Tables' Javascript API&lt;/title&gt;
  
      &lt;style type="text/css"&gt;
          #map-canvas {
              height: 800px;
              width: 800px;
          }
      &lt;/style&gt;
  
      &lt;script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"&gt;&lt;/script&gt; &lt;!-- Google Maps API --&gt;
      &lt;script type="text/javascript"&gt;
          var locationColumn = "geometry";
          var tableId = "1FbzvoRkdJzXvIxMJg2mGYVz5Q1BW2-4feMolgVc"; // California Census Tracts FT
          var condition = "'Median income (dollars)'&gt;0";
  
          var mapOptions = {
              mapTypeId: google.maps.MapTypeId.ROADMAP
          };
  
          function initialize() {
              var geocoder = new google.maps.Geocoder();
              var gmap = new google.maps.Map(document.getElementById('map-canvas'),mapOptions);
              var layer = new google.maps.FusionTablesLayer({
                  query: {
                      select: locationColumn,
                      from: tableId,
                      where: condition
                  },
                  styles: [
                      {
                          polygonOptions: {
                              strokeColor: "#ffffff",
                              strokeOpacity: 0.4,
                              strokeWeight: 1,
  
                              fillColorStyler: {
                                  kind: "fusiontables#gradient",
                                  columnName: "Median income (dollars)",
  
                                  gradient: {
                                      min: 28183.65,
                                      max: 122762.9,
                                      colors: [
                                          {
                                              color:"#990000",
                                              opacity:0.4
                                          },
                                          {
                                              color:"ffd966",
                                              opacity:0.4
                                          },
                                          {
                                              color:"#274e13",
                                              opacity:0.4
                                          }
                                      ]
                                  }
                              }
                          }
                      }
                  ]
              });
  
              geocoder.geocode(
                  {
                      'address':'California'
                  },
                  function(results,status){
                      var sw = results[0].geometry.viewport.getSouthWest();
                      var ne = results[0].geometry.viewport.getNorthEast();
                      var bounds = new google.maps.LatLngBounds(sw,ne);
                      gmap.fitBounds(bounds)
                  }
              );
  
              layer.setMap(gmap);
          }
  
          google.maps.event.addDomListener(window, 'load', initialize);
      &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div id="map-canvas"&gt;&lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>