This website is for Vega-Lite v4. Go to the main Vega-Lite homepage for the latest release.

Sorting

Edit this page
// A Single View or a Layer Specification
{
  ...,
  "mark/layer": ...,
  "encoding": {
    "x": {
      "field": ...,
      "type": ...,
      "sort": ...,         // sort
      ...
    },
    "y": ...,
    ...
  },
  ...
}

The sort property of a mark properties channel determines the order of the scale domain. Supported sort values depend on the field’s scale type.

Documentation Overview

Sorting Continuous Fields

If the channel has a continuous field (quantitative or time), sort can have the following values:

  • "ascending" (Default) – the field is sorted by the field’s value in ascending order.
  • "descending" – the field is sorted by the field’s value in descending order.

Example: Reversed X-Scale

Setting x’s sort to "descending" reverses the x-axis. Thus, the following visualization’s x-axis starts on the maximum value of the field “Horsepower” and ends on zero.

Sorting Discrete Fields

If the channel has a discrete scale (ordinal or nominal), sort can be one of: "ascending", "descending", a sort-by-encoding definition for sorting by another encoding a sort field definition for sorting by another field, an array specifying preferred order, or null.

Sort by the Field’s Natural Order

To order the data by the values’ natural order in JavaScript (e.g.,"a" < "b"), the sort property can be:

  • "ascending" (Default) – sort by the field’s value in ascending order.
  • "descending" – sort by the field’s value in descending order.

Sort by Another Encoding Channel

To sort data by another encoding channel, the sort property can be an encoding channel name to sort by (e.g., "x" or "y") with an optional minus prefix for descending sort (e.g., "-x" to sort by x-field, descending).

For example, the following plot sorts the y-values by the x-values (in descending order).

This is equivalent to using an object with the encoding and optional "order" property:

Property Type Description
encoding String

Required. The encoding channel to sort by (e.g., "x", "y")

order String | Null

The sort order. One of "ascending" (default), "descending", or null (no not sort).

For example, "sort": "-x" is equivalent to "sort": {"encoding": "x", "order": "descending"}.

Sort by a Different Field

To order data by another field, sort can be an encoding sort field definition, which has the following properties:

Property Type Description
field Field

The data field to sort by.

Default value: If unspecified, defaults to the field specified in the outer data reference.

op String

An aggregate operation to perform on the field prior to sorting (e.g., "count", "mean" and "median"). An aggregation is required when there are multiple values of the sort field for each encoded data field. The input data objects will be aggregated, grouped by the encoded data field.

For a full list of operations, please see the documentation for aggregate.

Default value: "sum" for stacked plots. Otherwise, "min".

order String | Null

The sort order. One of "ascending" (default), "descending", or null (no not sort).

For example, the following plot sorts "age" values on the y-axis by "sum" of "people". Note that this is equivalent to the example above.

Specifying Custom Sort Order

If the sort property is an array, it specifies the preferred order of values.

In the case that sort array contains every field value, the sort order will follow the specified values in the array.

If some values are ignored, the sort order will precede by the specified values in the array while unspecified values will follow their original order. For example, this plots orders B, A and C first, followed by Z, Y, X.

For discrete time fields, values in the sort array can be date-time definition objects. In addition, for time units "month" and "day", the values can be the month or day names (case insensitive) or their 3-letter initials (e.g., "Mon", "Tue").

For example, the following chart orders the day to start on Monday (instead of Sunday by default).

Note: It is also possible to sort by providing custom scale’s domain. However, it is more error-prone compared to using a sort array since domain requires every possible value to be included in the array. Thus, any value omitted from domain will not render properly.

No Sorting

If sort is null, the field is not sorted. This is equivalent to specifying sort: false in Vega’s scales.

Note: null is not supported for row and column.