CartoCSS Filters过滤器基本语法

CartoCSS in Mapbox Studio Classic

整理源自该页面：

https://www.mapbox.com/help/cartocss-in-studio

Styling data layers

• By layer ID

#layer_name {  // styles}#layer_1,#layer_2 {  // styles will apply to all the objects in both layers}

• By layer class

.roads {  // styles will apply to all layers  // with a class of 'roads'}

• Filter selectors

#road[class='motorway'] {  line-join: round;  line-color: #800, 75;}

• Zoom level filters

.roads {  // styles will apply to all layers  // with a class of 'roads'}

• By layer class

.roads {  // styles will apply to all layers  // with a class of 'roads'}

• Zoom level filters

Restrict styles to certain zoom levels:

#layer[zoom=0]{}

You can specify ranges of zoom levels using two filters:

#layer[zoom>=4][zoom<=10] {  }

You can nest filters to better organize your styles:

#layer[zoom>=4][zoom<=10] {  line-color: red;  line-width: 2;  [zoom=8] { line-width: 3; }  [zoom=9] { line-width: 4; }  [zoom=10] { line-width: 5; }}

• Numeric value comparision filters

You could create a style that only labels citites with a population of more than 1 million:

#cities[population>1000000] {  text-name: [name];  text-face-name: 'Open Sans Regular';}

You could also combine multiple numeric filters with zoom level filters to gradually bring in more populated cities as you zoom in.

#cities {  [zoom>=4][population>1000000],  [zoom>=5][population>500000],  [zoom>=6][population>100000] {    text-name: [name];    text-face-name: 'Open Sans Regular';  }}

As with zoom levels, you can select data based on numeric ranges.

#cities[population>100000][population<2000000] {  }

• Text comparsion filters

You can also filter columns that contain text:

#roads {  [class='motorway'] {    line-width: 4;  }  [class='main'] {    line-width: 2;  }  [class='street'] {    line-width: 1;  }}

You can also use the != (“not equal”)operator in the filter:

#roads[class!='motorway'] { }

• Regular expression filters

#roads[class=~'motorway.*'] {  }