The specification
The specification
Sets the angle value.
Sets the angle value.
Sets the angle property.
Sets the angle property.
Sets the overall size of the visualization.
Sets the overall size of the visualization. The total size of a Vega-Lite visualization may be determined by multiple factors: specified width, height, and padding values, as well as content such as axes, legends, and titles.
A boolean flag indicating if autosize layout should be re-calculated on every view update.
Determines how size calculation should be performed, one of "content" or "padding". The default setting ("content") interprets the width and height settings as the data rectangle (plotting) dimensions, to which padding is then added. In contrast, the "padding" setting includes the padding within the view size calculations, such that the width and height settings indicate the total intended size of the view.
CSS color property to use as the background of the entire view.
CSS color property to use as the background of the entire view.
Sets the color value.
Sets the color value.
Sets the color property.
Sets the color property.
Sets Vega-Lite configuration object that lists configuration properties of a visualization for creating a consistent theme.
Sets Vega-Lite configuration object that lists configuration properties of a visualization for creating a consistent theme. This property can only be defined at the top-level of a specification.
Sets the url of the data source.
Sets the url of the data source.
An URL from which to load the data set.
Type of input data: "json", "csv", "tsv", "dsv". Default value: The default format type is determined by the extension of the file URL. If no extension is detected, "json" will be used by default.
Sets a data frame describing the data source.
Sets a data frame describing the data source.
Sets an array of objects describing the data source.
Sets an array of objects describing the data source.
Sets a JSON array describing the data source.
Sets a JSON array describing the data source. Set to null to ignore the parent’s data source. If no data is set, it is derived from the parent.
Sets the description of this mark for commenting purpose.
Sets the description of this mark for commenting purpose.
Returns the HTML of plot specification with Vega Embed.
Returns the HTML of plot specification with Vega Embed.
Sets the channels x and y (quantitative), and optional color with default properties.
Sets the channels x and y (quantitative), and optional color with default properties.
Sets the fill value.
Sets the fill value.
Sets the fill property.
Sets the fill property.
Sets the top-level height properties to "container" to indicate that the height of the plot should be the same as its surrounding container.
Sets the top-level height properties to "container" to indicate that the height of the plot should be the same as its surrounding container. The width and height can be set independently, for example, you can have a responsive width and a fixed height by setting width to "container" and height to a number.
After setting width or height to "container", you need to ensure
that the container’s width or height is determined outside the plot.
For example, the container can be a
element that has style
width: 100%; height: 300px. When the container is not available
or its size is not defined (e.g., in server-side rendering),
the default width and height are config.view.continuousWidth
and config.view.continuousHeight, respectively.
Sets the height of the data rectangle (plotting) dimensions.
Sets the height of the data rectangle (plotting) dimensions.
For a discrete y-field, sets the height per discrete step..
For a discrete y-field, sets the height per discrete step..
Returns the HTML wrapped in an iframe to render in notebooks.
Returns the HTML wrapped in an iframe to render in notebooks.
the iframe HTML id.
Sets the latitude field.
Sets the latitude field.
Sets the latitude2 field.
Sets the latitude2 field.
Sets the Layer or single View specifications to be layered.
Sets the Layer or single View specifications to be layered.
Note: Specifications inside layer cannot use row and column channels as layering facet specifications is not allowed. Instead, use the facet operator and place a layer inside a facet.
Sets the longitude field.
Sets the longitude field.
Sets the longitude2 field.
Sets the longitude2 field.
Sets the mark property of a string (one of "bar", "circle", "square", "tick", "line", "area", "point", "rule", "geoshape", and "text").
Sets the mark property of a string (one of "bar", "circle", "square", "tick", "line", "area", "point", "rule", "geoshape", and "text").
Sets the mark definition object.
Sets the mark definition object. Marks are the basic visual building block of a visualization. They provide basic shapes whose properties (such as position, size, and color) can be used to visually encode data, either from a data field, or a constant value.
Sets the name of the visualization for later reference.
Sets the name of the visualization for later reference.
Sets the opacity value.
Sets the opacity value.
Sets the opacity property.
Sets the opacity property.
Specifies padding for each side.
Specifies padding for each side. The visualization padding, in pixels, is from the edge of the visualization canvas to the data rectangle.
Specifies padding for all sides.
Specifies padding for all sides. The visualization padding, in pixels, is from the edge of the visualization canvas to the data rectangle.
Sets geographic projection, which will be applied to shape path for "geoshape" marks and to latitude and "longitude" channels for other marks.
Sets geographic projection, which will be applied to shape path for "geoshape" marks and to latitude and "longitude" channels for other marks.
A cartographic projection maps longitude and latitude pairs to x, y coordinates. As with Vega, one can use projections in Vega-Lite to layout both geographic points (such as locations on a map) represented by longitude and latitude coordinates, or to project geographic regions (such as countries and states) represented using the GeoJSON format. Projections are specified at the unit specification level, alongside encoding. Geographic coordinate data can then be mapped to longitude and latitude channels (and longitude2 and latitude2 for ranged marks).
Sets the radius field.
Sets the radius field.
Sets the radius2 field.
Sets the radius2 field.
Axis resolutions.
Axis resolutions. For axes, resolutions can be defined for x and y (positional channels).
Legend resolutions.
Legend resolutions. For legends, resolutions can be defined for color, opacity, shape, and size (non-positional channels).
Scale resolutions.
Scale resolutions. For scales, resolution can be specified for every channel.
Selections are the basic building block in Vega-Lite’s grammar of interaction.
Selections are the basic building block in Vega-Lite’s grammar of interaction. They map user input (e.g., mouse moves and clicks, touch presses, etc.) into data queries, which can subsequently be used to drive conditional encoding rules, filter data points, or determine scale domains.
The simplest definition of selection consists of a name and a type. The selection type determines the default events that trigger a selection and the resultant data query.
Vega-Lite currently supports three selection types:
- "single" to select a single discrete data value on click. - "multi" to select multiple discrete data value; the first value is selected on click and additional values toggled on shift-click. - "interval" to select a continuous range of data values on drag.
(name, type) pairs
Sets a mark property.
Sets a mark property.
Sets a mark property by datum.
Sets a mark property by datum.
Sets a mark property by value.
Sets a mark property by value.
Sets the shape value.
Sets the shape value.
Sets the shape property.
Sets the shape property.
Sets the size value.
Sets the size value.
Sets the size property.
Sets the size property.
Sets the stroke value.
Sets the stroke value.
Sets the stroke property.
Sets the stroke property.
Sets the text value.
Sets the text value.
Sets the text property.
Sets the text property.
Sets the theta field.
Sets the theta field.
Sets the theta2 field.
Sets the theta2 field.
Sets a descriptive title to a chart.
Sets a descriptive title to a chart.
An array of data transformations such as filter and new field calculation.
An array of data transformations such as filter and new field calculation. Data transformations in Vega-Lite are described via either view-level transforms (the transform property) or field transforms inside encoding (bin, timeUnit, aggregate, sort, and stack).
When both types of transforms are specified, the view-level transforms are executed first based on the order in the array. Then the inline transforms are executed in this order: bin, timeUnit, aggregate, sort, and stack.
An array of data transformations such as filter and new field calculation.
An array of data transformations such as filter and new field calculation. Data transformations in Vega-Lite are described via either view-level transforms (the transform property) or field transforms inside encoding (bin, timeUnit, aggregate, sort, and stack).
When both types of transforms are specified, the view-level transforms are executed first based on the order in the array. Then the inline transforms are executed in this order: bin, timeUnit, aggregate, sort, and stack.
Optional metadata that will be passed to Vega.
Optional metadata that will be passed to Vega. This object is completely ignored by Vega and Vega-Lite and can be used for custom metadata.
Sets the view background’s fill and stroke.
Sets the view background’s fill and stroke. The background property of a top-level view specification defines the background of the whole visualization canvas. Meanwhile, the view property of a single-view or layer specification can define the background of the view.
Sets the top-level width properties to "container" to indicate that the width of the plot should be the same as its surrounding container.
Sets the top-level width properties to "container" to indicate that the width of the plot should be the same as its surrounding container. The width and height can be set independently, for example, you can have a responsive width and a fixed height by setting width to "container" and height to a number.
After setting width or height to "container", you need to ensure
that the container’s width or height is determined outside the plot.
For example, the container can be a
element that has style
width: 100%; height: 300px. When the container is not available
or its size is not defined (e.g., in server-side rendering),
the default width and height are config.view.continuousWidth
and config.view.continuousHeight, respectively.
Sets the width of the data rectangle (plotting) dimensions.
Sets the width of the data rectangle (plotting) dimensions.
For a discrete x-field, sets the width per discrete step.
For a discrete x-field, sets the width per discrete step.
Sets the x field.
Sets the x field.
Sets the x channel as a datum field.
Sets the x channel as a datum field.
Sets the x2 field.
Sets the x2 field.
Sets the xError field.
Sets the xError field.
Sets the xError2 field.
Sets the xError2 field.
Sets the y field.
Sets the y field.
Sets the y channel as a datum field.
Sets the y channel as a datum field.
Sets the y2 field.
Sets the y2 field.
Sets the yError field.
Sets the yError field.
Sets the yError2 field.
Sets the yError2 field.
To superimpose one chart on top of another.