Trail

Edit this page
{
  "data": ... ,
  "mark": "trail",
  "encoding": ... ,
  ...
}

The trail mark represents the data points stored in a field with a line connecting all of these points. Trail is similar to the line mark but a trail can have variable widths determined by backing data. Unlike lines, trails do not support different interpolation methods and use fill (not stroke) for their color. Trail marks are useful if you want to draw lines with changing size to reflect the underlying data.

Documentation Overview

Trail Mark Properties

// Single View Specification
{
  ...
  "mark": {
    "type": "trail",
    ...
  },
  "encoding": ... ,
  ...
}

A trail mark definition can contain any standard mark properties and the following properties:

Property Type Description
orient String

The orientation of a non-stacked bar, tick, area, and line charts. The value is either horizontal (default) or vertical.

  • For bar, rule and tick, this determines whether the size of the bar and tick should be applied to x or y dimension.
  • For area, this property determines the orient property of the Vega output.
  • For line and trail marks, this property determines the sort order of the points in the line if config.sortLineBy is not specified. For stacked charts, this is always determined by the orientation of the stack; therefore explicitly specified value will be ignored.

Examples

A Line Chart with varying size using trail mark

A Comet Chart showing changes between two states

Trail Config

// Top-level View Specification
{
  ...
  "config": {
    "trail": ...,
    ...
  }
}

The trail property of the top-level config object sets the default properties for all trail marks. If mark property encoding channels are specified for marks, these config values will be overridden.

The trail config can contain any trail mark properties (except type, style, and clip).