Map layers can dynamically react to user input in many ways – layers can change colors, size, or even functionality of their elements depending on the currently selected data, user configured variables or other interactions.

Most of these dynamic changes can be done using the paint and layout settings, where each property is checked for supported dynamic change syntaxes on load and changed when related data changes. E.g., settings a layers paint setting to {"line-width": "$lineSize$"} will change the width of lines in a layer dynamically, depending on the lineSize variable value.

Note that when using a variable/code snippet in a paint/layout property, it must be entered as a string (enclosed in double quotes) so the paint/layout setting will be a valid JSON object. . If you need to use a string inside the code snippet, use single quotes, e.g. "{'str' + 'ing'}".

Other settings that support dynamic changes are the popup settings for FeatureMap and PointInfoMap layers and gradient labels for FeatureMap and HeatMap layers.

Note that dynamic settings might impact performance since the layers need to be repainted every time relevant data is changed.

Layer Variables

Layer-specific variables can be referenced using the $varName$ syntax, e.g., using $lineSize$ will return the value of a variable with ID lineSize.

The variable is returned in the format it is set in (boolean, number, etc.).

Colors are returned as rgba function string for convenience (eg. "rgba(255, 0, 255, 0, 0.5)" for purple color with half opacity).

This syntax only works for variables set at the layer level. To access a global variable, use JS code with the ^var() user function.

Each variable object has the following settings:

• ID:
  The ID of the variable later used to reference it in other layer settings and functions.
• Default value:
  The initial value this variable will have when the project is loaded for the first time (before the user changes it).
• Label:
  Localized label to show next to the variable input in the menu.
• Input type:
  Type of the input to use for changing this variable’s value. Currently, these input types are supported:
  • Range: a range input for number variables
  • Checkbox: a checkbox input for boolean variables
  • Toggle: a toggle input for boolean variables
  • TextField: a textfield input for string or number inputs
  • TextArea: a textarea input for long strings
  • Select: a select input for choosing from predefined values
  • ButtonSelect: a select-like input where each option is a clickable button for choosing from predefined values
  • Color: a color input for color variables
• Visible:
  If set to false, the variable will not show up in the menu, but can still be changed using lvar user function and can be accessed in layer settings normally.
• Advanced:
  If set to true, the variable will be hidden under an “Advanced” category in the menu. Can be used to deter an inexperienced user from changing variables with potentially breaking effects.
• Input config:
  A JSON configuration for the selected input type. For details about configuration options, see the Inputs section.

GLayer currently provides the following variables that can be used:

• color[N]:
  available in FeatureMap and HeatMap. Corresponds to the colors set for the layer (color1 to the max color, color3 to the min). Especially useful for paint settings in FeatureMaps to make sure colors respond to the gradient.

JS Code Execution

Settings can be replaced with a result of a JS code snippet using the `{…JS code…} syntax: eg. {Math.round($count$)}. Popup settings already evaluate their input as JS code, so there is no need to use the curly braces there.

User Functions

For easier handling of various GLayer functionality, a set of JS functions is available to use inside evaluated JS code blocks. To use one of the functions available, use the ``^fncName(arguments) syntax inside the evaluated expression, e.g., to get the currently filtered value for a field with ID field0, you can use the filter() user function: filter("field0").

For a complete list of available functions, refer to the User Functions section.