1 of 1

scales Property

General scales property JSON format:

The scales specification is one or more arrays with the following properties:

Note: As a general rule, limit the total number of domain and range values used to a maximum of 1000. Exceeding this limit can cause an error.

Example

Scales Properties

name

The name property uniquely identifies the scale for reference by other properties.

type

The type property specifies how to transform the input, domain data to output, range visual values. Vega supports the following transforms, categorized by quantitative, discrete, and discretizing scales:

Quantitative Scales

Discrete Scales

Discretizing Scales

domain

The domain field specifies the domain of input data values. For quantitative data, this can take the form of a two-element array.

Example:

Specify minimum and maximum input values.

domain: [ -100, 999 ]

For ordinal or categorical data, the domain can be an array of valid input values.

Example

Specify valid input data languages.

"domain": ["en",  "es", "fr"]

range

Scale range specifies the set of visual values. For numeric values, the range can take the form of a two-element array with minimum and maximum values. For ordinal or quantized data, the range can be an array of desired output values, which are mapped to elements in the specified domain.

Scale ranges can be specified in the following ways:

As an array of static values: "range": [0, 500] or "range": ['a', 'b', 'c'].
Using pre-defined literals: "range": "width" or "range": "height".

Example

Specify a color scale that quantizes input values between 0 and 100 among five visual output colors.

{
  name: "color",
  type: "quantize",
  domain: [ 0, 100 ],
  range: [ "#115f9a", "#1984c5", "#c9e52f", "#d0ee11", "#d0f400"
  ]
}

Scale ranges can accept width and height string literals that map to the Width and Height Properties.

Value

Description

width

A spatial range that is the value of t``width``.

height

A spatial range that is the value of height. The direction of the range, top-to-bottom or bottom-to-top, is determined by to the scale type.

Example

Specify a y scale that linearly maps input values between 0 and 500 to the height of the visualization area.

{
    name: "y",
    type: "linear",
    domain: [ 0, 500 ],
    range: "height"
}

default

The default scales property specifies the output value to use when the input domain value does not map to the range.

The default property is not applicable to the threshold scale type, which maps domain values outside of the range to either the lowest or highest range value.

accumulator

The accumulator property enables you to identify regional density of data in a layer of a backend render and apply pixel coloring based on the accumulation mode that you have defined. Each data point is rendered individually, providing an accurate representation of data distribution in a spatial setting.

Mode

Description

density

Perform count aggregation per pixel and define a color for a pixel by normalizing the count and applying a color to it based on a color scale.

You can activate density accumulation for any scale that takes as input a continuous domain (linear, sqrt, pow, log, threshold scales) and outputs a color range. The range is determined by the required minDensityCnt and maxDensityCnt properties. minDensityCnt and maxDensityCnt can be explicit integer values or one of the following keywords that automatically compute statistical information about the per-pixel counts:

min
max
-1stStdDev
-2ndStdDev
1stStdDev
2ndStdDev

Note: Domain values of density accumulators must be between 0 and 1 inclusive.

blend

Blend by category (ultimately an ordinal scale). You can provide a color to a category and blend those colors to show the density of the distinct categorical values at a pixel.

pct

For a specific category, apply color based on the percentage of the category in a region.

Example

Apply a density accumulator to a linear scale named pointcolor:

{
  "name": "pointcolor",
  "type": "linear",
  "domain": [0.0,1.0],
  "range": ["blue","red"],
  "clamp": true,
  "accumulator": "density",
  "minDensityCnt": 1,
  "maxDensityCnt": 100
}

The color at a pixel is determined by normalizing per-pixel aggregated counts and using that value in the scale function to calculate a color. Normalization is performed according to the required minDensityCnt and maxDensityCnt properties. After normalization, minDensityCnt == 0 and maxDensityCnt == 1.

minDensityCnt and maxDensityCnt can have explicit integer values or use one of the following keywords to compute statistical information about per-pixel counts: min, max, -1stStdDev, -2ndStdDev, 1stStdDev, 2ndStdDev.

For more detailed examples of using accumulators, see Tutorial: Vega Accumulator.