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

Circle

Edit this page
// Single View Specification
{
  "data": ... ,
  "mark": "circle",
  "encoding": ... ,
  ...
}

circle mark is similar to point mark, except that (1) the shape value is always set to circle (2) they are filled by default.

Circle Mark Properties

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

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

Property Type Description
size Number | ExprRef

Default size for marks. - For point/circle/square, this represents the pixel area of the marks. Note that this value sets the area of the symbol; the side lengths will increase with the square root of this value. - For bar, this represents the band size of the bar, in pixels. - For text, this represents the font size, in pixels.

Default value: - 30 for point, circle, square marks; width/height’s step - 2 for bar marks with discrete dimensions; - 5 for bar marks with continuous dimensions; - 11 for text marks.

Examples

Scatterplot with Circle

Here is an example scatter plot with circle marks:

Circle Config

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

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

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