Mapbox GL JS 表达式概述

表达式(expressions)是Mapbox GL JS的一个高级功能,它为数据的添加和渲染展示提供了更多的灵活性。

表达式的功能包括:

  • 数据驱动样式:根据一个或多个数据属性指定样式规则。
  • 算术:对源数据进行算术运算,例如执行单位转换计算。
  • 条件逻辑:使用基本的if-then逻辑,例如,根据要素中可用的属性甚至名称的长度,准确确定要为标签显示的文本。
  • 字符串操作:使用大写,小写和标题大小写转换来控制标签文本,而无需修改,重新准备和重新上传数据。

表达式功能强大,可以在数据渲染中提供很多灵活性,他事实上是Mapbox GL JS跟据数据源对JavaScript的一种封装。在Mapbox GL JS中可以将任何布局属性,绘图属性或过滤器的值指定为表达式

句法

Mapbox GL JS表达式使用类似Lisp的语法,使用JSON数组格式。表达式遵循以下格式:

[expression_name, argument_0, argument_1, ...]

expression_name表达式运算符,例如,可以使用'*'乘两个参数或'case'创造条件逻辑。

Mapbox GL提供的表达式运算符集包括:

  • 用于对数值执行算术运算和其他运算的数学运算符 (如'+' '-' '*' '/')
  • 用于操纵布尔值和进行条件决策的逻辑运算符 (如'case' 'let')
  • 用于操纵字符串的字符串运算符 (如string转number)
  • 数据操作员,提供对源功能属性的访问 (如 ‘get')
  • 摄像机操作员,提供对定义当前地图视图的参数的访问 (如 'zoom')

参数argument_0或者是文字(数字,字符串或布尔值),或者他们自己的表达。参数的数量因表达式而异。

这是使用表达式执行基本算术表达式(π* 3 2)的一个示例:

['*', ['pi'], ['^', 3, 2]]

此处式子仅用作示例,示例使用'*'表达式将两个参数相乘。第一个参数是'pi',这是一个返回数学常数pi的表达式。第二个参数是另一个表达式:一个'^'带有两个参数的表达式。它将返回3 2,结果将乘以π。

示例2:

'filter':['>',['number',['get','FID_1'],0],50000]

筛选数据中,FID属性值大于50000的要素。

 

深入学习参考:

https://docs.mapbox.com/help/tutorials/mapbox-gl-js-expressions/#syntax

https://docs.mapbox.com/mapbox-gl-js/style-spec/#expressions

你可能感兴趣的:(Mapbox,GL,JS)