plot
| Kind | kit |
|---|---|
| Capabilities | file |
| Categories | data-visualization graphics |
| Keywords | visualization plotting charts algebra-of-graphics vega-lite |
Compositional visualization library inspired by Algebra of Graphics
Inspired by Daniel Slutsky's Implementing the Algebra of Graphics in Clojure - Part 1 and AlgebraOfGraphics.
Files
Dependencies
- kit-svg - Type-safe SVG generation library for Kit
Related Packages
- kit-dataframe - High-performance columnar DataFrame for Kit with SIMD acceleration
- kit-linear-algebra - High-performance linear algebra via BLAS/LAPACK (uses Accelerate on macOS, OpenBLAS on Linux)
- kit-ticker - Well-known ticker symbols for stocks, ETFs, indexes, and crypto
- kit-ta-lib - A TA-Lib wrapper for Kit
Installation
kit add gitlab.com/kit-lang/packages/kit-plot.gitUsage
import Kit.Plot as PlotQuick Start
import Kit.Plot as Plot
# Create data
data = [
[("x", Plot.VFloat 1.0), ("y", Plot.VFloat 2.0)],
[("x", Plot.VFloat 2.0), ("y", Plot.VFloat 4.0)],
[("x", Plot.VFloat 3.0), ("y", Plot.VFloat 3.0)]
]
# Build a scatter plot using pipes
spec = data
|> Plot.data
|> Plot.x "x"
|> Plot.y "y"
|> Plot.scatter
|> Plot.to-spec
|> Plot.title "My Scatter Plot"
# Output as Vega-Lite JSON
Plot.print-json spec
# Or output as SVG
Plot.print-svg specCore Concepts
Layer-Based Composition
Everything starts with a Layer - a single visualization of data with mappings and visual marks.
# Create a layer
layer = data
|> Plot.data # Attach data
|> Plot.x "x" # Map x aesthetic
|> Plot.y "y" # Map y aesthetic
|> Plot.scatter # Set visual markAesthetic Mappings
Map data fields to visual properties:
| Function | Description |
|---|---|
Plot.x | X-axis position |
Plot.y | Y-axis position |
Plot.color | Color encoding |
Plot.size | Size encoding |
Plot.shape | Shape encoding |
Plot.alpha | Opacity encoding |
Plot.fill | Fill color |
Plot.stroke | Stroke color |
Plot.label | Text labels |
Visual Marks
| Function | Description |
|---|---|
Plot.scatter | Scatter plot (points) |
Plot.line | Line chart |
Plot.bar | Bar chart |
Plot.area | Area chart |
Plot.histogram | Histogram |
Plot.boxplot | Box plot |
Plot.text | Text marks |
Plot.rule | Reference lines |
Plot.rainbow | Rainbow chart (log-regression colored bands) |
Plot.rainbow-with-config | Rainbow chart with custom config |
Plot.biplot | PCA biplot (scores + loading arrows) |
Plot.biplot-with-config | PCA biplot with custom config |
Backend Support Matrix
| Chart Type | Vega-Lite | SVG | Plotly | Chart.js | Observable |
|---|---|---|---|---|---|
| Scatter | ✓ | ✓ | ✓ | ✓ | ✓ |
| Line | ✓ | ✓ | ✓ | ✓ | ✓ |
| Bar | ✓ | ✓ | ✓ | ✓ | ✓ |
| Area | ✓ | ✓ | ✓ | ✓ | |
| Histogram | ✓ | ✓ | ✓ | ✓ | ✓ |
| Boxplot | ✓ | ✓ | ✓ | ||
| Text | ✓ | ||||
| Rule | ✓ | ✓ | |||
| Pie / Donut | ✓ | ✓ | ✓ | ✓ | |
| Heatmap | ✓ | ✓ | ✓ | ✓ | |
| Lollipop | ✓ | ✓ | ✓ | ✓ | |
| Density | ✓ | ✓ | ✓ | ✓ | |
| Strip | ✓ | ✓ | ✓ | ✓ | |
| Violin | ✓ | ✓ | ✓ | ||
| Waterfall | ✓ | ✓ | ✓ | ✓ | ✓ |
| Funnel | ✓ | ✓ | ✓ | ✓ | ✓ |
| Candlestick | ✓ | ✓ | ✓ | ✓ | ✓ |
| OHLC | ✓ | ✓ | ✓ | ✓ | ✓ |
| Error Bar | ✓ | ✓ | ✓ | ✓ | |
| Radar | ✓ | ✓ | |||
| Treemap | ✓ | ||||
| Rainbow | ✓ | ✓ | |||
| Biplot | ✓ | ✓ |
Examples
Line Chart
time-series = [
[("month", Plot.VInt 1), ("sales", Plot.VFloat 120.0)],
[("month", Plot.VInt 2), ("sales", Plot.VFloat 150.0)],
[("month", Plot.VInt 3), ("sales", Plot.VFloat 180.0)]
]
spec = time-series
|> Plot.data
|> Plot.x "month"
|> Plot.y "sales"
|> Plot.line
|> Plot.to-spec
|> Plot.title "Monthly Sales"
|> Plot.x-label "Month"
|> Plot.y-label "Sales ($)"Bar Chart
categories = [
[("category", Plot.VString "A"), ("value", Plot.VFloat 45.0)],
[("category", Plot.VString "B"), ("value", Plot.VFloat 72.0)],
[("category", Plot.VString "C"), ("value", Plot.VFloat 58.0)]
]
spec = categories
|> Plot.data
|> Plot.x "category"
|> Plot.y "value"
|> Plot.bar
|> Plot.to-spec
|> Plot.title "Category Comparison"Layered Plot
Overlay multiple visual marks:
scatter-layer = data
|> Plot.data
|> Plot.x "x"
|> Plot.y "y"
|> Plot.scatter
line-layer = data
|> Plot.data
|> Plot.x "x"
|> Plot.y "y"
|> Plot.line
spec = Plot.overlay [scatter-layer, line-layer]
|> Plot.title "Scatter with Line"Faceted Plot
Create small multiples:
spec = grouped-data
|> Plot.data
|> Plot.x "x"
|> Plot.y "y"
|> Plot.scatter
|> Plot.to-spec
|> Plot.facet-wrap "group"
|> Plot.title "By Group"Rainbow Chart
Overlay logarithmically-spaced colored bands on price data to indicate valuation zones:
price-data = [
[("date", Plot.VString "2020-01-01"), ("price", Plot.VFloat 7200.0)],
[("date", Plot.VString "2021-01-01"), ("price", Plot.VFloat 29000.0)],
[("date", Plot.VString "2022-01-01"), ("price", Plot.VFloat 47000.0)],
[("date", Plot.VString "2023-01-01"), ("price", Plot.VFloat 16500.0)],
[("date", Plot.VString "2024-01-01"), ("price", Plot.VFloat 42000.0)]
]
spec = price-data
|> Plot.data
|> Plot.x "date"
|> Plot.y "price"
|> Plot.rainbow
|> Plot.to-spec
|> Plot.title "Bitcoin Rainbow Chart"The default config uses 9 bands from "Basically a Fire Sale" to "Maximum Bubble Territory". Customize with rainbow-with-config:
cfg = Plot.default-rainbow-config
spec = price-data
|> Plot.data
|> Plot.x "date"
|> Plot.y "price"
|> Plot.rainbow-with-config cfg
|> Plot.to-specPCA Biplot
Overlay PCA observation scores (scatter points) with variable loadings (arrows). PCA is computed via power iteration on the covariance matrix -- no external dependencies required.
iris-data = [
[("sepal-length", Plot.VFloat 5.1), ("sepal-width", Plot.VFloat 3.5), ("petal-length", Plot.VFloat 1.4), ("petal-width", Plot.VFloat 0.2), ("species", Plot.VString "setosa")],
[("sepal-length", Plot.VFloat 7.0), ("sepal-width", Plot.VFloat 3.2), ("petal-length", Plot.VFloat 4.7), ("petal-width", Plot.VFloat 1.4), ("species", Plot.VString "versicolor")],
[("sepal-length", Plot.VFloat 6.3), ("sepal-width", Plot.VFloat 3.3), ("petal-length", Plot.VFloat 6.0), ("petal-width", Plot.VFloat 2.5), ("species", Plot.VString "virginica")]
]
spec = iris-data
|> Plot.data
|> Plot.color "species"
|> Plot.biplot
|> Plot.to-spec
|> Plot.title "Iris PCA Biplot"No Plot.x/Plot.y needed -- axes are auto-set to PC1/PC2 with variance labels. Fields mapped to aesthetics (color, label) are excluded from PCA automatically. Customize with biplot-with-config:
cfg = {
standardize: true,
pc-x: 1,
pc-y: 2,
show-loadings: true,
loading-scale: 1.2,
arrow-color: "#0066cc",
label-color: "#222222",
num-iterations: 100,
fields: []
}
spec = iris-data
|> Plot.data
|> Plot.color "species"
|> Plot.biplot-with-config cfg
|> Plot.to-specOutput Backends
Vega-Lite JSON
# Get JSON string
json = Plot.to-vega-lite spec
# Print to stdout
Plot.print-json spec
# Get embeddable HTML
html = Plot.to-vega-lite-html specSVG
# Get SVG string
svg = Plot.to-svg spec
# Print to stdout
Plot.print-svg spec
# Custom configuration
svg = Plot.to-svg-with-config spec configAPI Design
All multi-argument functions use data-first signatures for pipe compatibility:
# The layer/spec is always the first argument
Plot.x layer "field" # Layer -> String -> Layer
Plot.title spec "text" # PlotSpec -> String -> PlotSpec
# This enables clean pipe chains
data |> Plot.data |> Plot.x "x" |> Plot.y "y" |> Plot.scatterLicense
MIT License - see LICENSE for details.
Third-Party Licenses
kit-plot generates output for several third-party visualization libraries. These libraries are not bundled with kit-plot but are loaded via CDN in the generated HTML output:
| Library | License |
|---|---|
| Chart.js | MIT License |
| Vega-Lite | BSD 3-Clause License |
| Plotly.js | MIT License |
| Observable Plot | ISC License |
Exported Functions & Types
value-to-json
Convert a plot Value to a JSONValue.
Value -> JSONValue
value-to-json (VInt 42) # => JSONInt 42
value-to-json (VString "hello") # => JSONString "hello"lookup-field
Look up a field value in a data row by field name.
List (String, Value) -> String -> Option Value
row = [("x", VInt 10), ("y", VInt 20)]
lookup-field row "x" # => Some (VInt 10)
lookup-field row "z" # => Nonehas-field?
Check if a data row has a specific field.
List (String, Value) -> String -> Bool
row = [("x", VInt 10)]
has-field? row "x" # => true
has-field? row "z" # => falseget-field-value
Get a field value as JSONValue, defaulting to JSONNull if not found.
List (String, Value) -> String -> JSONValue
row = [("x", VInt 10)]
get-field-value row "x" # => JSONInt 10
get-field-value row "z" # => JSONNullrow-to-json
Convert a data row to a JSONObject.
List (String, Value) -> JSONValue
row = [("x", VInt 10), ("y", VInt 20)]
row-to-json row # => JSONObject [("x", JSONInt 10), ("y", JSONInt 20)]dataset-to-json
Convert a dataset (list of rows) to a JSONArray.
List (List (String, Value)) -> JSONValue
data = [[("x", VInt 1)], [("x", VInt 2)]]
dataset-to-json data # => JSONArray [JSONObject [...], ...]extract-values
Extract values from a field as a JSONArray.
List (List (String, Value)) -> String -> JSONValue
data = [[("x", VInt 1)], [("x", VInt 2)], [("y", VInt 3)]]
extract-values data "x" # => JSONArray [JSONInt 1, JSONInt 2]extract-values-list
Extract values as a list (for internal processing).
List (List (String, Value)) -> String -> List JSONValue
extract-unique-values
Extract unique values from a field as a JSONArray.
List (List (String, Value)) -> String -> JSONValue
data = [[("x", VString "a")], [("x", VString "b")], [("x", VString "a")]]
extract-unique-values data "x" # => JSONArray [JSONString "a", JSONString "b"]get-field-for-channel
Get the field name for a specific aesthetic channel from mappings.
List AesMapping -> AesChannel -> Option String
mappings = [{channel: AesX, field: "date"}, {channel: AesY, field: "value"}]
get-field-for-channel mappings AesX # => Some "date"
get-field-for-channel mappings AesSize # => Noneget-x-field
Get x field name from aesthetic mappings, defaulting to "x".
List AesMapping -> String
get-y-field
Get y field name from aesthetic mappings, defaulting to "y".
List AesMapping -> String
get-color-field
Get color field name from aesthetic mappings (optional).
List AesMapping -> Option String
get-size-field
Get size field name from aesthetic mappings (optional).
List AesMapping -> Option String
get-series-color
Get a color from the palette by index. Falls back to primary color if index is out of bounds.
Palette -> Int -> String
palette = {primary: "#000", colors: ["#f00", "#0f0", "#00f"], ...}
get-series-color palette 0 # => "#f00"
get-series-color palette 99 # => "#000"build-object-optional
Build a JSONObject, filtering out pairs where the value is None. Useful for constructing JSON with optional fields.
List (String, Option JSONValue) -> JSONValue
build-object-optional [
("name", Some (JSONString "test")),
("age", None)
]
# => JSONObject [("name", JSONString "test")]build-object-nonempty
Build a JSONObject from a list of key-value pairs. Filters out pairs where the value is an empty string (for string values).
List (String, JSONValue) -> JSONValue
jstring
Convenience: wrap a string in JSONString.
String -> JSONValue
jint
Convenience: wrap an int in JSONInt.
Int -> JSONValue
jfloat
Convenience: wrap a float in JSONFloat.
Float -> JSONValue
jbool
Convenience: wrap a bool in JSONBool.
Bool -> JSONValue
jarray
Convenience: create a JSONArray.
List JSONValue -> JSONValue
jobject
Convenience: create a JSONObject.
List (String, JSONValue) -> JSONValue
compute-log-regression
Compute logarithmic regression coefficients (a, b) for data points. Fits log(y) = a * ln(x_index + 1) + b via least-squares. Returns (a, b) as a tuple.
[Float] -> (Float, Float)
compute-rainbow-bands
Compute rainbow band boundaries for each data point. Given regression params (a, b), number of bands, and a spread factor, returns a list of (regression-value, [band-boundary]) for each x index. Each element is a list of (num-bands + 1) boundary values evenly spaced in log space.
(Float, Float) -> Int -> Float -> Int -> [(Float, [Float])]
is-value-numeric?
Check if a Value is numeric (Int or Float).
Value -> Bool
value-to-float-num
Convert a Value to Float. Returns 0.0 for non-numeric values.
Value -> Float
extract-numeric-fields
Identify numeric field names from the first data row.
DataRow -> [String]
extract-numeric-matrix
Extract a matrix of floats from a dataset for given field names. Returns [[Float]] where each inner list is a row of values.
DataSet -> [String] -> [[Float]]
vec-dot
Dot product of two vectors.
[Float] -> [Float] -> Float
vec-norm
Euclidean norm of a vector.
[Float] -> Float
vec-normalize
Normalize a vector to unit length.
[Float] -> [Float]
vec-scale
Scalar * vector.
Float -> [Float] -> [Float]
vec-sub
Vector subtraction: a - b.
[Float] -> [Float] -> [Float]
mat-vec-mul
Matrix-vector multiplication: mat * vec. mat is [[Float]] (list of rows), vec is [Float].
[[Float]] -> [Float] -> [Float]
compute-column-means
Compute column-wise means of a matrix.
[[Float]] -> [Float]
compute-column-stds
Compute column-wise standard deviations of a matrix (given means).
[[Float]] -> [Float] -> [Float]
center-matrix
Center a matrix by subtracting column means from each row.
[[Float]] -> [Float] -> [[Float]]
standardize-matrix
Standardize a centered matrix by dividing by column standard deviations.
[[Float]] -> [Float] -> [[Float]]
compute-covariance
Compute the covariance matrix from a centered matrix. Returns [[Float]] of size p x p.
[[Float]] -> [[Float]]
deflate-matrix
Remove an eigenvector's contribution from a matrix: A' = A - lambda * v * vT.
[[Float]] -> Float -> [Float] -> [[Float]]
power-iteration
Extract the dominant eigenvector via power iteration. Returns (eigenvalue, eigenvector).
[[Float]] -> Int -> (Float, [Float])
compute-pca
Full PCA pipeline: extract fields, center, [standardize], covariance, power iteration. Returns {scores: [[Float]], loadings: [[Float]], variance-pct: [Float], field-names: [String]}.
DataSet -> BiplotConfig -> [String] -> {scores: [[Float]], loadings: [[Float]], variance-pct: [Float], field-names: [String]}
from-int
Convert an integer to a Value.
Int -> Value
from-float
Convert a float to a Value.
Float -> Value
from-string
Convert a string to a Value.
String -> Value
from-bool
Convert a boolean to a Value.
Bool -> Value
null-value
The null value constant.
is-null?
Check if a value is null.
Value -> Bool
is-numeric?
Check if a value is numeric (int or float).
Value -> Bool
value-to-int
Extract an integer from a Value, if present.
Value -> Option Int
value-to-float
Extract a float from a Value, converting ints if needed.
Value -> Option Float
row
Create a data row from a list of field/value pairs.
[(String, Value)] -> DataRow
get-field
Get a field value from a data row by key.
String -> DataRow -> Option Value
empty-dataset
An empty dataset with no rows.
from-rows
Create a dataset from a list of rows.
[DataRow] -> DataSet
row-count
Get the number of rows in a dataset.
DataSet -> Int
data
Create a layer from a dataset. Entry point for the pipe API.
DataSet -> Layer
layer
An empty layer constant.
add-mapping
Add an aesthetic mapping to a layer.
Layer -> AesChannel -> String -> Layer
set-visual
Set the visual mark type for a layer.
Visual -> Layer -> Layer
set-stat
Set the statistical transformation for a layer.
Stat -> Layer -> Layer
add-scale
Add a scale to a layer for a specific channel.
Layer -> AesChannel -> Scale -> Layer
layer-label
Set the label (series name) for a layer. Used for legends.
Layer -> String -> Layer
get-mapping
Get an aesthetic mapping from a layer by channel.
Layer -> AesChannel -> Option AesMapping
has-mapping?
Check if a layer has a mapping for a channel.
Layer -> AesChannel -> Bool
get-mapped-field
Get the field name mapped to a channel, if present.
Layer -> AesChannel -> Option String
x
Map a field to the X-axis position.
Layer -> String -> Layer
y
Map a field to the Y-axis position.
Layer -> String -> Layer
color
Map a field to color encoding.
Layer -> String -> Layer
size
Map a field to size encoding.
Layer -> String -> Layer
shape
Map a field to shape encoding.
Layer -> String -> Layer
alpha
Map a field to opacity encoding.
Layer -> String -> Layer
label
Map a field to text labels.
Layer -> String -> Layer
fill
Map a field to fill color.
Layer -> String -> Layer
stroke
Map a field to stroke color.
Layer -> String -> Layer
scatter
Set the visual mark to scatter (points).
Layer -> Layer
scatter-sized
Set the visual mark to scatter with a specific size.
Layer -> Float -> Layer
bubble
Set the visual mark to bubble chart (scatter with data-driven size). Use with the size combinator to map a field to bubble size.
Layer -> Layer
line
Set the visual mark to line.
Layer -> Layer
line-width
Set the visual mark to line with a specific width.
Layer -> Float -> Layer
bar
Set the visual mark to bar.
Layer -> Layer
bar-position
Set the visual mark to bar with a specific position adjustment.
Layer -> BarPosition -> Layer
bar-grouped
Set the visual mark to grouped (dodged) bar for side-by-side comparison.
Layer -> Layer
bar-stacked-fill
Set the visual mark to stacked bar (normalized to 100%).
Layer -> Layer
area
Set the visual mark to area.
Layer -> Layer
area-stacked
Set the visual mark to stacked area.
Layer -> Layer
area-fill
Set the visual mark to normalized stacked area (100% fill).
Layer -> Layer
histogram
Set the visual mark to histogram.
Layer -> Layer
histogram-bins
Set the visual mark to histogram with a specific number of bins.
Layer -> Int -> Layer
boxplot
Set the visual mark to boxplot.
Layer -> Layer
text
Set the visual mark to text.
Layer -> Layer
rule
Set the visual mark to rule (reference line).
Layer -> Layer
pie
Set the visual mark to pie chart.
Layer -> Layer
donut
Set the visual mark to donut chart (pie with inner radius).
Layer -> Layer
donut-with-radius
Set the visual mark to donut chart with custom inner radius.
Layer -> Float -> Layer
heatmap
Set the visual mark to heatmap.
Layer -> Layer
heatmap-with-scheme
Set the visual mark to heatmap with a specific color scheme.
Layer -> ColorScheme -> Layer
lollipop
Set the visual mark to lollipop (dot + stem).
Layer -> Layer
lollipop-sized
Set the visual mark to lollipop with custom dot size.
Layer -> Float -> Layer
density
Set the visual mark to density plot (kernel density estimation).
Layer -> Layer
density-bandwidth
Set the visual mark to density plot with custom bandwidth.
Layer -> Float -> Layer
strip
Set the visual mark to strip plot (categorical scatter).
Layer -> Layer
jitter
Set the visual mark to strip plot with jitter for overlapping points.
Layer -> Float -> Layer
violin
Set the visual mark to violin plot (distribution shape by category).
Layer -> Layer
violin-bandwidth
Set the visual mark to violin plot with custom bandwidth.
Layer -> Float -> Layer
waterfall
Set the visual mark to waterfall chart (with connectors).
Layer -> Layer
waterfall-no-connectors
Set the visual mark to waterfall chart without connectors.
Layer -> Layer
funnel
Set the visual mark to funnel chart (vertical orientation).
Layer -> Layer
funnel-horizontal
Set the visual mark to funnel chart with horizontal orientation.
Layer -> Layer
candlestick
Set the visual mark to candlestick chart with default field names (open, high, low, close).
Layer -> Layer
candlestick-fields
Set the visual mark to candlestick chart with custom field names.
Layer -> String -> String -> String -> String -> Layer
ohlc
Set the visual mark to OHLC bar chart with default field names (open, high, low, close).
Layer -> Layer
ohlc-fields
Set the visual mark to OHLC bar chart with custom field names.
Layer -> String -> String -> String -> String -> Layer
error-bar
Set the visual mark to error bars (symmetric error using a single error field). Displays scatter points with vertical error bars.
Layer -> String -> Layer
error-bar-asymmetric
Set the visual mark to asymmetric error bars (different upper and lower errors).
Layer -> String -> String -> Layer
radar
Set the visual mark to radar/spider chart. The axes parameter lists the field names for each axis. Supported by Chart.js (native) and Plotly (scatterpolar).
Layer -> [String] -> Layer
radar-with-opacity
Set the visual mark to radar chart with custom fill opacity.
Layer -> [String] -> Float -> Layer
treemap
Set the visual mark to treemap for hierarchical data. Requires id-field (unique identifier), parent-field (parent id, empty string for root), and value-field (size of each node). Supported by Plotly (native treemap type).
Layer -> String -> String -> String -> Layer
treemap-with-labels
Set the visual mark to treemap with custom label field.
Layer -> String -> String -> String -> String -> Layer
rainbow
Set the visual mark to rainbow chart with default 9-band Bitcoin-style configuration. Overlays logarithmic regression bands on price data to indicate valuation zones.
Layer -> Layer
rainbow-with-config
Set the visual mark to rainbow chart with custom configuration.
Layer -> RainbowConfig -> Layer
biplot
Set the visual mark to PCA biplot with default configuration. Auto-computes PCA on all numeric columns, excluding aesthetic-mapped fields. No Plot.x/Plot.y needed — axes are set to PC1/PC2 with variance labels.
Layer -> Layer
biplot-with-config
Set the visual mark to PCA biplot with custom configuration.
Layer -> BiplotConfig -> Layer
stat-identity
Apply identity transformation (no change).
Layer -> Layer
stat-count
Apply count aggregation.
Layer -> Layer
stat-bin
Apply binning transformation.
Layer -> Layer
stat-bin-n
Apply binning transformation with a specific number of bins.
Layer -> Int -> Layer
stat-smooth
Apply LOESS smoothing transformation.
Layer -> Layer
stat-smooth-linear
Apply linear regression smoothing.
Layer -> Layer
stat-smooth-loess
Apply LOESS smoothing transformation.
Layer -> Layer
scale-x-linear
Set X-axis to linear scale.
Layer -> Layer
scale-x-log
Set X-axis to logarithmic scale.
Layer -> Layer
scale-x-sqrt
Set X-axis to square root scale.
Layer -> Layer
scale-x-time
Set X-axis to time scale.
Layer -> Layer
scale-y-linear
Set Y-axis to linear scale.
Layer -> Layer
scale-y-log
Set Y-axis to logarithmic scale.
Layer -> Layer
scale-y-sqrt
Set Y-axis to square root scale.
Layer -> Layer
scale-y-time
Set Y-axis to time scale.
Layer -> Layer
scale-color
Set color scale with a specific scheme.
Layer -> ColorScheme -> Layer
scale-color-categorical
Set color scale to categorical (category10).
Layer -> Layer
scale-color-viridis
Set color scale to viridis.
Layer -> Layer
scale-color-blues
Set color scale to blues.
Layer -> Layer
scale-color-greens
Set color scale to greens.
Layer -> Layer
scale-color-reds
Set color scale to reds.
Layer -> Layer
to-spec
Convert a layer to a plot specification.
Layer -> PlotSpec
overlay
Create a plot specification from multiple layers (overlay).
[Layer] -> PlotSpec
layers
Alias for overlay.
[Layer] -> PlotSpec
title
Set the plot title.
PlotSpec -> String -> PlotSpec
subtitle
Set the plot subtitle.
PlotSpec -> String -> PlotSpec
x-label
Set the X-axis label.
PlotSpec -> String -> PlotSpec
y-label
Set the Y-axis label.
PlotSpec -> String -> PlotSpec
dimensions
Set the plot dimensions (width and height).
PlotSpec -> Int -> Int -> PlotSpec
width
Set the plot width.
PlotSpec -> Int -> PlotSpec
height
Set the plot height.
PlotSpec -> Int -> PlotSpec
facet-wrap
Apply wrap faceting by a field.
PlotSpec -> String -> PlotSpec
facet-wrap-cols
Apply wrap faceting with a specific number of columns.
PlotSpec -> String -> Int -> PlotSpec
facet-grid
Apply grid faceting by row and column fields.
PlotSpec -> Option String -> Option String -> PlotSpec
facet-row
Apply row faceting by a field.
PlotSpec -> String -> PlotSpec
facet-col
Apply column faceting by a field.
PlotSpec -> String -> PlotSpec
theme
Set a custom theme for the plot.
PlotSpec -> PlotTheme -> PlotSpec
theme-dark
Apply the dark theme to the plot.
PlotSpec -> PlotSpec
theme-minimal
Apply the minimal theme to the plot.
PlotSpec -> PlotSpec
animate
Enable animation with a specific duration in milliseconds.
PlotSpec -> Int -> PlotSpec
animate-with-easing
Enable animation with duration and easing.
PlotSpec -> Int -> AnimationEasing -> PlotSpec
no-animate
Disable animation.
PlotSpec -> PlotSpec
legend-position
Set the legend position.
PlotSpec -> LegendPosition -> PlotSpec
legend-title
Set the legend title.
PlotSpec -> String -> PlotSpec
legend-font-size
Set the legend font size.
PlotSpec -> Int -> PlotSpec
no-legend
Hide the legend.
PlotSpec -> PlotSpec
to-vega-lite
Convert a plot specification to Vega-Lite JSON string.
PlotSpec -> String
to-vega-lite-html
Convert a plot specification to embeddable HTML with Vega-Lite.
PlotSpec -> String
print-json
Print Vega-Lite JSON to stdout.
PlotSpec -> String
print-html
Print embeddable HTML to stdout.
PlotSpec -> String
to-svg
Convert a plot specification to SVG string.
PlotSpec -> String
to-svg-with-config
Convert a plot specification to SVG with custom configuration.
PlotSpec -> SvgConfig -> String
print-svg
Print SVG to stdout.
PlotSpec -> String
to-plotly
Convert a plot specification to Plotly JSON string.
PlotSpec -> String
to-plotly-html
Convert a plot specification to embeddable HTML with Plotly.js.
PlotSpec -> String
print-plotly-json
Print Plotly JSON to stdout.
PlotSpec -> String
print-plotly-html
Print Plotly HTML to stdout.
PlotSpec -> String
to-chartjs
Convert a plot specification to Chart.js JSON string.
PlotSpec -> String
to-chartjs-html
Convert a plot specification to embeddable HTML with Chart.js.
PlotSpec -> String
print-chartjs-json
Print Chart.js JSON to stdout.
PlotSpec -> String
print-chartjs-html
Print Chart.js HTML to stdout.
PlotSpec -> String
to-observable
Convert a plot specification to Observable Plot JavaScript.
PlotSpec -> String
to-observable-html
Convert a plot specification to embeddable HTML with Observable Plot.
PlotSpec -> String
print-observable-js
Print Observable Plot JavaScript to stdout.
PlotSpec -> String
print-observable-html
Print Observable Plot HTML to stdout.
PlotSpec -> String
Value
A data value that can appear in a dataset. Supports integers, floats, strings, booleans, and null values.
Variants
VInt {Int}VFloat {Float}VString {String}VBool {Bool}VNullDataRow
A single row of data as a list of field name/value pairs.
DataSet
A dataset consisting of multiple data rows.
AesChannel
Visual channels that data can be mapped to. These represent the different ways data can be encoded visually.
Variants
AesXAesYAesColorAesSizeAesShapeAesAlphaAesLabelAesFillAesStrokeMaps a data field to a visual channel. Used to specify which data column drives which visual property.
BarPosition
Position adjustment for bar charts with grouped data.
Variants
PositionStackPositionDodgePositionFillAreaPosition
Position adjustment for area charts (stacking options).
Variants
AreaNormalAreaStackAreaFillFunnelOrientation
Orientation for funnel charts.
Variants
FunnelVerticalFunnelHorizontalError bar configuration for statistical uncertainty visualization.
Radar chart configuration for multi-variable comparison.
Treemap configuration for hierarchical data visualization.
Rainbow chart configuration for logarithmic regression band visualization. Used for Bitcoin-style rainbow charts showing valuation zones.
PCA biplot configuration for overlaying observation scores with variable loadings. Computes PCA via power iteration on the covariance matrix.
default-biplot-config
Default biplot configuration: standardize, show PC1 vs PC2 with loadings.
default-rainbow-config
Default 9-band Bitcoin-style rainbow configuration.
Field mapping for OHLC (Open-High-Low-Close) finance charts. Allows custom field names for candlestick and OHLC bar charts.
default-ohlc-fields
Default OHLC field names (open, high, low, close).
Visual
The visual mark type that determines how data points are rendered. Each variant represents a different chart type with optional configuration.
Variants
VisualScatter {size, alpha}VisualLine {width}VisualBar {width, position}VisualArea {alpha, position}VisualHistogram {bins}VisualBoxplotVisualText {size}VisualRule {width}VisualPie {inner-radius}VisualHeatmap {color-scheme}VisualLollipop {size}VisualDensity {bandwidth}VisualStrip {jitter}VisualViolin {bandwidth}VisualWaterfall {show-connectors}VisualFunnel {orientation}VisualCandlestick {fields, width}VisualOHLC {fields, width}VisualErrorBar {config, width}VisualRadar {config}VisualTreemap {config}VisualRainbow {config}VisualBiplot {config}ColorScheme
Color schemes for categorical and continuous color scales.
Variants
Categorical10ViridisBluesGreensRedsOrangesPurplesGreysCustomColors {_0}Scale
Scale transformations for mapping data to visual properties.
Variants
ScaleLinearScaleLogScaleSqrtScaleOrdinalScaleTimeScaleColor {ColorScheme}SmoothMethod
Methods for smoothing/regression in stat-smooth.
Variants
LoessLinearRegressionStat
Statistical transformations applied to data before rendering.
Variants
StatIdentityStatCountStatBin {bins}StatSmooth {method}Facet
Faceting configuration for creating small multiples.
Variants
FacetNoneFacetWrap {field, columns}FacetGrid {row, col}A standardized color palette for consistent coloring across all backends. Used for multi-series charts and theming.
default-palette
Default color palette with category10-inspired colors.
dark-palette
Dark theme color palette with brighter colors for dark backgrounds.
minimal-palette
Minimal theme color palette with muted, understated colors.
Theme configuration for plot styling.
default-theme
Default theme with no custom styling.
dark-theme
Dark theme with dark background and light text.
minimal-theme
Minimal theme with clean, simple styling.
AnimationEasing
Easing functions for animations.
Variants
EaseLinearEaseInEaseOutEaseInOutAnimation configuration for chart transitions.
default-animation
Default animation configuration (enabled with library defaults).
no-animation
No animation configuration.
LegendPosition
Position of the legend relative to the chart.
Variants
LegendTopLegendBottomLegendLeftLegendRightLegendNoneLegend configuration for customizing appearance and position.
default-legend
Default legend configuration (right position, no title).
A single visualization layer combining data, mappings, and visual mark. Layers can be composed to create complex multi-layer plots.
empty-layer
An empty layer with no data, mappings, or visual.
Complete plot specification ready for rendering. Contains layers, metadata, faceting, theme, animation, and legend configuration.
empty-spec
An empty plot specification with default settings.
PlotError
Errors that can occur during plot construction or rendering.
Variants
InvalidData {message}MissingMapping {channel}RenderError {message}UnsupportedVisual {visual}Configuration for SVG backend rendering.
default-svg-config
Default SVG configuration with standard dimensions and colors.