Mapbox常用表达式整理（2）

表达式参考

Types 类型操作符

boolean

如果提供了多个值，则按顺序计算每个值，直到得到一个布尔值为止。如果所有输入都不是布尔值，则表达式是错误的。

['boolean', ['feature-state', 'hover'], false]

首先看['feature-state', 'hover']表达式的值是否为bool值，如果是，则返回对应的bool值；如果否，则按顺序依次往后看第二个值是否为bool值。

format

返回一个格式化字符串，用于在text-field属性中显示混合格式文本。支持3个属性：font-scale, text-font, text-color
语法：

["format",
    input_1: string | image, options_1: { "font-scale": number, "text-font": array<string>, "text-color": color },
    ...,
    input_n: string | image, options_n: { "font-scale": number, "text-font": array<string>, "text-color": color }
]

input_n表示输入项，类型可以是string或者image；options_n表示可选项，是一个包含多个属性的对象。

'layout': {
	'text-field': [
		'format',
		['upcase', ['get', 'FacilityName']],
		{ 'font-scale': 0.8 },
		'\n',
		{},
		['downcase', ['get', 'Comments']],
		{ 'font-scale': 0.6 }
	],
}

[
	'format',
		['get', 'name_en'],
		{ 'font-scale': 1.2 },
		'\n',
		{},
		['get', 'name'],
		{
			'font-scale': 0.8,
			'text-font': ['DIN Offc Pro Italic', 'Arial Unicode MS Regular']
		}
]

number

如果提供了多个值，则按顺序计算每个值，直到得到一个数字。如果所有输入都不是数字，则表达式是错误的。

["number", value]
["number", value, fallback: value, fallback: value, ...]

fallback表示备用值。

number-format

使用提供的格式规则将输入数字转换为字符串表示形式。
语法：

["number-format",
    input: number,
    options: { "locale": string, "currency": string, "min-fraction-digits": number, "max-fraction-digits": number }
]: string

支持的属性有locale本地化、currency货币、min-fraction-digits最少小数位数和max-fraction-digits最多小数位数。

'layout': {
	'text-field': [
		'number-format',
		['get', 'mag'],
		{ 
			'min-fraction-digits': 1, 
			'max-fraction-digits': 1 
		}
	]
},

to-boolean

将输入值转换为布尔值。当输入为空字符串、0、false、null或NaN时，结果为false;否则就是true。

["to-boolean", value]: boolean

to-number

将输入值转换为一个数字。如果输入为null或false，则结果为0。如果输入为true，则结果为1。如果输入是一个字符串，它将按照ECMAScript语言规范将其转换为指定的数字。

["to-number", value, fallback: value, fallback: value, ...]: number

to-string

将输入值转换为一个字符串。

["to-string", value]: string

'layout': {
	'text-field': [
		'concat',
		['to-string', ['get', 'mag']],
		'm'
	]
},

Feature Data 要素数据操作符

feature-state

从当前feature-state中检索属性值。如果所请求的属性在feature-state上不存在，则返回null。feature-state不是GeoJSON或矢量瓦片数据的一部分，必须在每个feature上以编程的方式设置。feature由它们的id属性标识，该属性必须是整数或可以转换为整数的字符串。

数据格式示例：

{
	"type":"FeatureCollection", 
	"features": [
		{
			"type":"Feature",
			"geometry":{
				"type":"Polygon",
				"coordinates":[[[-80.519,40.6388],[-80.5191,40.5902],[-80.5191,39.958],[-80.5193,39.7214],[-79.4767,39.7211],[-79.4869,39.2059]]]
			},
			"properties":{
				"STATE_ID":"54",
				"STATE_NAME":"West Virginia"
			},
			"id":54
		},
	]
}

注意id的位置不在properties的属性中

'paint': {
	'fill-color': '#627BC1',
	'fill-opacity': [
		'case',
		['boolean', ['feature-state', 'hover'], false],
		1,
		0.5
	]
}

hoveredStateId = e.features[0].id;
map.setFeatureState(
	{ source: 'states', id: hoveredStateId },
	{ hover: false }
);

geometry-type

获取要素的几何类型：Point, MultiPoint, LineString, MultiLineString, Polygon, MultiPolygon.

["geometry-type"]: string

Lookup 查找操作符

get（高频率使用）

从当前feature的属性中检索属性值，如果提供第二个参数，则从另一个对象中检索属性值。

["get", string]: value
["get", string, object]: value

// 高度拉伸
'paint': {
	'fill-extrusion-color': ['get', 'color'],
	'fill-extrusion-height': ['get', 'height'],
	'fill-extrusion-base': ['get', 'base_height'],
	'fill-extrusion-opacity': 0.5
}

has

测试当前feature的属性中是否有属性值，如果提供第二个参数，则测试是否有来自另一个对象的属性值。

["has", string]: boolean
["has", string, object]: boolean

// 筛选'airport'图层中有'abbrev'属性的要素
map.setFilter('airport', ['has', 'abbrev']);

in（高频率使用）

确定某元素是否存在于数组中，或子字符串是否存在于字符串中。

["in",
    keyword: InputType (boolean, string, or number),
    input: InputType (array or string)
]: boolean

map.addLayer({
	id: 'measure-points',
	type: 'circle',
	source: 'geojson',
	paint: {
		'circle-radius': 5,
		'circle-color': '#000'
	},
	// 筛选数据的几何类型
	filter: ['in', '$type', 'Point']
});
map.addLayer({
	id: 'measure-lines',
	type: 'line',
	source: 'geojson',
	layout: {
		'line-cap': 'round',
		'line-join': 'round'
	},
	paint: {
		'line-color': '#000',
		'line-width': 2.5
	},
	filter: ['in', '$type', 'LineString']
});

// 筛选出图层中要素的"FIPS"属性值为"08017", "08015", "08041"的要素
map.setFilter('counties-highlighted', ["in", "FIPS", "08017", "08015", "08041"]);

注意数组的元素需要展开写入到表达式中。