Keyboard shortcuts

Press or to navigate between chapters

Press S or / to search in the book

Press ? to show this help

Press Esc to hide this help

Encoding

The encoding object binds data fields to visual channels.

Channels

FamilyChannels
Positionx, y, x2, y2, theta, theta2, radius, radius2
Color & opacitycolor, fill, stroke, opacity
Size & shapesize, shape
Text & ordertext, tooltip, order, detail
Facetrow, column
Sankeysource, target, value

Channel shape

"x": {
  "field": "score",
  "type": "quantitative",
  "aggregate": "mean",
  "scale": {"type": "log"},
  "axis": {"title": "Average score", "format": ".2f"},
  "sort": "-y"
}
KeyPurpose
fieldColumn from the source (or transform output).
typeOne of nominal, ordinal, quantitative, temporal.
aggregateFriendly alias: mean, sum, count, median, q1, q3, min, max, stdev, variance, ci0, ci1, distinct, mode, plus wmean, ratio, lift, share.
scaleScale spec (type, domain, range, scheme, padding, …).
axisAxis config (title, format, grid, tick_count, label_angle, …).
legendLegend config (title, orient, direction, …).
formatd3-format string for label formatting.
sort"ascending" / "descending" / "-y" / [explicit, order, ...].
keytrue to mark this channel as the animation join key — see Spec › Animation. At most one channel per encoding may set this; only valid on position channels (x, y, x2, y2, theta, radius) and mark channels (color, fill, stroke, opacity, size, shape, sankey source/target/value, geo longitude/latitude/feature).

Conditions

A channel can carry a condition clause that switches its visual value based on a declared selection or a Pulse expression test. The channel’s own value / field supplies the fallback (“otherwise”) branch.

"color": {
  "condition": [
    {"selection": "brush", "value": "#22c55e"},
    {"test": "score < 0",  "value": "#ef4444"}
  ],
  "value": "#94a3b8"
}

Rules:

  • selection references a name declared in the spec’s selection block (validate rule PRISM_SPEC_025).
  • test is a Pulse expression evaluated at encode time (PRISM_SPEC_026); the same parser that powers filter and calculate transforms.
  • Each entry needs exactly one of value or field. A selection-form entry without value inherits the channel’s own field binding (PRISM_SPEC_027).
  • Entries evaluate top-down; the first match wins.

Where the work happens:

  • test-driven entries are evaluated server-side at encode time and baked directly into the mark’s resolved style. SVG and PDF output reflect them with no client involvement.
  • selection-driven entries land in the scene-IR as a Mark.Conditions[] slice. The browser-side prism-selection module flips the matching SVG attribute when the named selection becomes active, and reverts to the resolved “otherwise” branch when it clears.
  • PDF renders the “otherwise” branch for selection entries (PDFs are static); a PRISM_WARN_PDF_CONDITION_FLATTENED warning fires when this would have changed the page.

See the conditions gallery and the highlight-on-brush recipe.

Scales

Eight types: linear (default for quantitative), log, pow, sqrt, time (default for temporal), band (default for nominal bar x), point (default for nominal point x), ordinal (default for color over nominal).

See the scales gallery for one fixture per type.

Axes & legends

Both are auto-generated based on the encoded channels but can be overridden per channel. Bundled support: 4 orientations (bottom/left/top/right), major + minor ticks, grid toggle, label rotation, overlap handling, gradient + symbol legends.

Tooltip channel

"tooltip": [
  {"field": "brand_id"},
  {"field": "score", "format": ".2f"}
]

Materialized in the Scene IR as pre-formatted TooltipLine lists. SVG emits <title> per mark; the JS port renders rich HTML tooltips in P12+.

Further reading