Configuration

{
  "data": ... ,
  "mark": ... ,
  "encoding": ... ,
  "config": {          // Configuration Object
    ...               // - Top-level Configuration
    "cell": { ... },   // - Cell Configuration
    "mark": { ... },   // - Mark Configuration
    "scale": { ... },  // - Scale Configuration
    "axis": { ... },   // - Axis Configuration
    "legend": { ... }, // - Legend Configuration
    "facet": { ... }   // - Facet Configuration
  }
}

Vega-Lite’s config object lists configuration properties of a visualization. This page outlines different types of config properties:

• Top-level Configuration
• Cell Configuration
• Mark Configuration
• Scale Configuration
• Axis Configuration
• Legend Configuration
• Facet Configuration

Top-level Configuration (config.*)

A Vega-Lite config object can have the following top-level properties:

Cell Configuration (config.cell.*)

At its core, a Vega-Lite specification describes a single plot. When a facet channel is added, the visualization is faceted into a trellis plot, which contains multiple plots. Each plot in either a single plot or a trellis plot is called a cell. Cell configuration allows us to customize each individual single plot and each plot in a trellis plot.

Cell Size Configuration

width and height property of the cell configuration determine the width of a visualization with a continuous x-scale and the height of a visualization with a continuous y-scale respectively.

For more information about visualization’s size, please see Customizing Size page.

Cell Style Configuration

Mark Configuration (config.mark.*)

mark property of the config is a mark config object, which sets the default properties of the visualization’s marks. Some of these properties will be overridden by data mapped to mark properties channels.

A mark config object can have the following properties:

Color

Example: filled Points

By default, point marks have filled borders and are transparent inside. Setting config.mark.filled to true creates filled marks instead.

Opacity

Stroke Style

Stacking (for Bar and Area)

Interpolation (for Line and Area Marks)

Example: interpolate with monotone

Example: interpolate with line-step (Step-Chart)

Orientation (for Bar, Tick, Line, and Area Marks)

Bar Config

Point Config

Point Size Config (for Point, Circle, and Square Marks)

Tick Config

Example Customizing Tick’s Size and Thickness

Text Config

Text Position

Font Style

Text Value and Format

Scale Configuration (config.scale.*)

Scale configuration determines default properties for all scales except for row and column (which are determined by facet scale configuration instead).

See Code: For a full list of scale configuration and their default values, please see the ScaleConfig interface and defaultScaleConfig in scale.ts.

Axis Configuration (config.axis.*)

Axis configuration determines default properties for x and y axes. (For row and column axes, see facet axis configuration).

See Code: For a full list of axis configuration and their default values, please see the AxisConfig interface and defaultAxisConfig in axis.ts.

Legend Configuration (config.legend.*)

Legend configuration determines default properties for legends.

See Code: For a full list of legend configuration and their default values, please see the LegendConfig interface and defaultLegendConfig in legend.ts.

Facet Configuration (config.facet.*)

Cell Configuration (config.facet.cell.*)

Facet cell configuration overrides cell config for faceted (trellis) plots. Please see cell config for each property name and default values.

Facet Grid Configuration (config.facet.grid.*)

Facet Scale Configuration (config.facet.scale.*)

Facet scale configuration determines default properties for row and column scales. See Code: For a full list of scale configuration and their default values, please see the FacetScaleConfig interface and defaultFacetScaleConfig in scale.ts.

Facet Axis Configuration (config.facet.axis.*)

Facet axis configuration determines default properties for row and column axes. See Code: For a full list of facet axis configuration and their default values, please see the AxisConfig interface and defaultFacetAxisConfig in axis.ts.