# Amazon Quick JSON expression language for Highcharts visuals
JSON expression language for Highcharts

Highcharts visuals accept most [valid JSON values](https://www.w3schools.com/js/js_json_datatypes.asp), standard arithmetic operators, string operators, and conditional operators. The following JSON values are not supported for Highcharts visuals:
+ Functions
+ Dates
+ Undefined values

Quick authors can use JSON expression language create JSON schemas for a highcharts visual. JSON expression language is used to bind JSON to APIs or datasets to allow dynamic population and modification of JSON structures. Developers can also use JSON expression language to inflate and transform JSON data with concise and intuitive expressions.

With JSON expression language, expressions are represented as arrays, where the first element specifies the operation and subsequent elements are the arguments. For example, `["unique", [1, 2, 2]]` applies the `unique` operation to the array `[1, 2, 2]`, resulting in `[1, 2]`. This array-based syntax allows for flexible expressions, that allow complex transformations on JSON data.

JSON expression language supports *nested expressions*. Nested expressions are expressions that contain other expressions as arguments. For example `["split", ["toUpper", "hello world"], " "]` first converts the string `hello world` into an uppercase, then splits it into array of words, resulting in `["HELLO", "WORLD"]`.

Use the following sections to learn more about JSON expression language for Highcharts visuals in Amazon Quick.

**Topics**
+ [

# Arithmetics
](jle-arithmetics.md)
+ [

# Array operations
](jle-arrays.md)
+ [

# Amazon Quick expressions
](jle-qs-expressions.md)

# Arithmetics


The following table shows arithmetic expressions that can be used with JSON expression language.


| Operation | Expression | Input | Output | 
| --- | --- | --- | --- | 
| Addition | ["\$1", operand1, operand2] | \$1 sum: ["\$1", 2, 4] \$1 | \$1 sum: 6 \$1 | 
| Subtraction | ["-", operand1, operand2] | \$1 difference: ["-", 10, 3] \$1 | \$1 difference: 7 \$1 | 
| Multiplication | ["\$1", operand1, operand2] | \$1 product: ["\$1", 5, 6] \$1 | \$1 product: 30 \$1 | 
| Division | ["/", operand1, operand2] | \$1 quotient: ["/", 20, 4] \$1 | \$1 quotient: 5 \$1 | 
| Modulo | ["%", operand1, operand2] | \$1 remainder: ["%", 15, 4] \$1 | \$1 remainder: 3 \$1 | 
| Exponentiation | ["\$1\$1", base, exponent] | \$1 power: ["\$1\$1", 2, 3] \$1 | \$1 power: 8 \$1 | 
| Absolute Value | ["abs", operand] | \$1 absolute: ["abs", -5] \$1 | \$1 absolute: 5 \$1 | 
| Square Root | ["sqrt", operand] | \$1 sqroot: ["sqrt", 16] \$1 | \$1 sqroot: 4 \$1 | 
| Logarithm (base 10) | ["log10", operand] | \$1 log: ["log10", 100] \$1 | \$1 log: 2 \$1 | 
| Natural Logarithm | ["ln", operand] | \$1 ln: ["ln", Math.E] \$1 | \$1 ln: 1 \$1 | 
| Round | ["round", operand] | \$1 rounded: ["round", 3.7] \$1 | \$1 rounded: 4 \$1 | 
| Floor | ["floor", operand] | \$1 floor: ["floor", 3.7] \$1 | \$1 floor: 3 \$1 | 
| Ceiling | ["ceil", operand] | \$1 ceiling: ["ceil", 3.2] \$1 | \$1 ceiling: 4 \$1 | 
| Sine | ["sin", operand] | \$1 sine: ["sin", 0] \$1 | \$1 sine: 0 \$1 | 
| Cosine | ["cos", operand] | \$1 cosine: ["cos", 0] \$1 | \$1 cosine: 1 \$1 | 
| Tangent | ["tan", operand] | \$1 tangent: ["tan", Math.PI] \$1 | \$1 tangent: 0 \$1 | 

# Array operations


JSON expression language allows generic array manipulation for the following functions:
+ `map` – Applies a mapping function to each element of an array and returns a new array with the transformed values.

  For example, `["map", [1, 2, 3], ["*", ["item"], 2]]` maps each element of the array `[1, 2, 3]` by multiplying it by 2.
+ `filter` – Filters an array based on a given condition and returns a new array containing only the elements that satisfy the condition

  For example, `["filter", [1, 2, 3, 4, 5], ["==", ["%", ["item"], 2], 0]]` filters the array `[1, 2, 3, 4, 5]` to include only the even numbers.
+ `reduce` – Reduces an array to a single value by applying a reducer function to each element and accumulating the result.

  For example, `["reduce", [1, 2, 3, 4, 5], ["+", ["acc"], ["item"]], 0]` reduces the array `[1, 2, 3, 4, 5]` to the sum of its elements.
+ `get` – Retrieves a value from an object or an array by specifying a key or index.

  For example, `["get", ["item"], "name"]` retrieves the value of the `"name"` property from the current item.
+ `unique` – Given an array returns only unique items inside this array.

  For example, `["unique", [1, 2, 2]]` returns `[1, 2]`.

# Amazon Quick expressions


Amazon Quick offers additional expressions to enhance the functionality of Highcharts visuals. Use the following sections to learn more about common Quick expressions for highcharts visuals. For more information about JSON expression language in Amazon Quick, see the [Highcharts Visual QuickStart Guide](https://democentral.learnquicksight.online/#Dashboard-FeatureDemo-Highcharts-Visual) in [DemoCentral](https://democentral.learnquicksight.online/#).

**Topics**
+ [

## `getColumn`
](#highcharts-expressions-getcolumn)
+ [

## `formatValue`
](#highcharts-expressions-formatvalue)

## `getColumn`


Use the `getColumn` expressions to return values from specified column indices. For example, the following table shows a list of products alongside their category, and price.


| Product name | Category | Price | 
| --- | --- | --- | 
|  Product A  |  Technology  |  100  | 
|  Product B  |  Retail  |  50  | 
|  Product C  |  Retail  |  75  | 

The following `getColumn` query generates an array that shows all product names alongside their price.

```
{
	product name: ["getColumn", 0], 
	price: ["getColumn", 2]
}
```

The follwing JSON is returned:

```
{
	product name: ["Product A", "Product B", "Product C"],
	price: [100, 50, 75]
}
```

You can also pass multiple columns at once to generate an array of arrays, shown in the following example.

**Input**

```
{
	values: ["getColumn", 0, 2]
}
```

**Output**

```
{
	values: [["Product A", 100], ["Product B", 50], ["Product C", 75]]
}
```

Similar to `getColumn`, the following expressions can be used to return column values from field wells or themes:
+ `getColumnFromGroupBy` returns columns from the group by field. The second argument is the index of the column to return. For example, `["getColumnFromGroupBy", 0]` returns values of the first field as an array. You can pass multiple indices to get an array of arrays where each element corresponds to the field in the group by field well.
+ `getColumnFromValue` returns columns from the value field well. You can pass multiple indices to get an array of arrays where each element corresponds to the field in the values field well.
+ `getColorTheme` returns the current color pallete of a Quick theme, shown in the following example.

  ```
  {
  "color": ["getColorTheme"]
  }
  ```

  ```
  {
  "color": ["getPaletteColor", "secondaryBackground"]
  }
  ```

**Example**

![\[alt text not found\]](http://docs.amazonaws.cn/en_us/quick/latest/userguide/images/get-column-example.png)


`getColumn` can access any column from the table:
+ `["getColumn", 0]` - returns array `[1, 2, 3, 4, 5, ...]`
+ `["getColumn", 1]` - returns array `[1, 1, 1, 1, 1, ...]`
+ `["getColumn", 2]` - returns array `[1674, 7425, 4371, ...]`

`getColumnFromGroupBy` works similarly, but its index is limited to the columns in the group by field well:
+ `["getColumnFromGroupBy", 0]` - returns array `[1, 2, 3, 4, 5, ...]`
+ `["getColumnFromGroupBy", 1]` - returns array `[1, 1, 1, 1, 1, ...]`
+ `["getColumnFromGroupBy", 2]` - does not work, since there are only two columns in the group by field well

`getColumnFromValue` works similarly, but its index is limited to the columns in the value field well:
+ `["getColumnFromValue", 0]` - returns array `[1, 2, 3, 4, 5, ...]`
+ `["getColumnFromValue", 1]` - does not work, since there is only one column in the value field well
+ `["getColumnFromValue", 2]` - does not work, since there is only one column in the value field well

## `formatValue`


Use the `formatValue` expression to apply Quick formatting to your values. For example, the following expression formats the x-axis label with the format value that is specified in the first field of Quick field wells.

```
 "xAxis": {
		"categories": ["getColumn", 0],
		"labels": {
		"formatter": ["formatValue", "value", 0]
		}
	}
```