Styling fusion table layers polygons

问题

I have a fusion table with 5 populations (columns), for each these I want to display the polygons with the highest concentration of population in a different color.

In the example for styling fusion table layers, the "polygonOptions" was defined, but I don't want the polygons to have any styling unless there's a concentration of one of the populations, and also because that would take 1 style away from the limit of 5.

I'm not sure what to change or what I'm missing to have these styles display correctly.

My map: http://seflculturemap.com/miami-test.html

回答1:

The first problem you have are the column-names, when they contain whitespaces, you must wrap them in single-quotes inside the query.

The other issue(that you need to apply 6 styles but there is a limit of 5). You also may create styles directly for a map, so you may create a dummy-style that sets the opacity of all polygons to 0.

To apply this style use the ID of the style and pass it with the options-parameter to the Layer. I've created such a dummy-style for your map, it does have the ID 4

The layer-creation now should look like this: var layer1 = new google.maps.FusionTablesLayer({

  query: {
    select: 'geometry',
    from:   '1PM3_L795Eus1HXCylF6UM0tLqXarnkNZeB_LmM8'

  },
  options: {
        styleId: 4
      },
  styles: [
     {
        where: "'Puerto Rican Population' > 500",
    polygonOptions: {
     fillColor: "#46A2D1", //blue
     fillOpacity: 0.7}  
     },
   {
        where: "'Cuban Population' > 500",
    polygonOptions: {
     fillColor: "#F29400", //orange
     fillOpacity: 0.7 }   
     }, 
     {
        where: "'Bahaman Population' > 100",
    polygonOptions: {
     fillColor: "#BAC200", //yellow
     fillOpacity: 0.7}  
     },  
     {
        where: "'Dominican Population' >200",
    polygonOptions: {
     fillColor: "#E068A0", //pink
     fillOpacity: 0.7 }   
     },
     {
        where: "'Haitian Population' > 500",
    polygonOptions: {
     fillColor: "#66A919", //green
     fillOpactity: 0.7}
   }
    ]
});

Test: http://jsfiddle.net/doktormolle/8mZuB/

Related to the comments:

you are using wrong column-names.

For http://www.seflculturemap.com/maps/central-american-populations.html:

'Nicaraguan' -> 'Nicaraguan Population'

For http://www.seflculturemap.com/maps/south-american-populations.html:

'Venezuelan Population'  ->'Venzuelan Population
'Peruvian'               ->'Peruvian Population'
'Argentinian Population' ->'Argentinean Population'

来源：https://stackoverflow.com/questions/15674143/styling-fusion-table-layers-polygons

标签

css

google-fusion-tables

layer