ggsvelte
GitHub
Navigate
On this page

ScaleColorBinned

Binned color scale: continuous values → ordered color steps.

Defaults

helper
scaleColorBinned
family
color-fill
aesthetic
color
scale type
binned
options type
BinnedColorScaleOptions

Also exported as

  • ScaleColourBinned

Svelte component

import { GGPlot, GeomPoint, ScaleColorBinned } from "@ggsvelte/svelte";

<GGPlot data={rows} aes={{ x: "x", y: "y", color: "group" }}>
  <ScaleColorBinned />
  <GeomPoint />
</GGPlot>

JSON scales

{
  "scales": {
    "color": {
      "type": "binned"
    }
  }
}

Params

domain

Array<DomainValue>

Explicit semantic domain. Manual/ordinal scales use ordered values; sequential/binned scales use [min, max].

breaks

Array<number | string>

Explicit semantic reference ticks for sequential colorbars or ordered boundaries for binned colorsteps.

range

Array<string>

Explicit #rgb/#rrggbb colors. Manual pairs them with domain values; sequential/binned interpolate or sample them.

scheme

"observable10" | "ipsum" | "flexoki" | "tableau10" | "colorblind" | "stata" | "stata_s1color" | "stata_s1rcolor" | "stata_mono" | "economist" | "solarized" | "few" | "few_light" | "few_dark" | "fivethirtyeight" | "ptol" | "canva" | "wsj" | "wsj_rgby" | "wsj_red_green" | "wsj_black_green" | "wsj_dem_rep" | "tableau20" | "tableau_colorblind" | "tableau_seattle_grays" | "tableau_miller_stone" | "tableau_superfishel_stone" | "tableau_nuriel_stone" | "tableau_jewel_bright" | "tableau_summer" | "tableau_winter" | "tableau_green_orange_teal" | "tableau_red_blue_brown" | "tableau_purple_pink_gray" | "tableau_hue_circle" | "gdocs" | "hc" | "hc_dark" | "pander" | "calc" | "excel" | "excel_fill" | "excel_new" | "Set1" | "Set2" | "Set3" | "Dark2" | "Paired" | "Accent" | "hue" | "grey" | "gray" | "viridis" | "magma" | "plasma" | "inferno" | "cividis" | "turbo" | "Blues" | "Greens" | "Reds" | "Oranges" | "Purples" | "Greys" | "YlOrRd" | "YlGnBu" | "BuPu" | "RdYlBu" | "RdBu" | "BrBG" | "Spectral" | "PuOr" | "tableau_seq_blue_green" | "tableau_seq_blue_light" | "tableau_seq_orange_light" | "tableau_seq_blue" | "tableau_seq_orange" | "tableau_seq_green" | "tableau_seq_red" | "tableau_seq_purple" | "tableau_seq_brown" | "tableau_seq_gray" | "tableau_seq_gray_warm" | "tableau_seq_blue_teal" | "tableau_seq_orange_gold" | "tableau_seq_green_gold" | "tableau_seq_red_gold" | "tableau_div_orange_blue" | "tableau_div_red_green" | "tableau_div_green_blue" | "tableau_div_red_blue" | "tableau_div_red_black" | "tableau_div_gold_purple" | "tableau_div_red_green_gold" | "tableau_div_sunset_sunrise" | "tableau_div_orange_blue_white" | "tableau_div_red_green_white" | "tableau_div_green_blue_white" | "tableau_div_red_blue_white" | "tableau_div_red_black_white" | "tableau_div_orange_blue_light" | "tableau_div_temperature"

Named color scheme: categorical "observable10" (default), "ipsum", "flexoki", "tableau10", "colorblind", "hue", "grey", "gray", and ColorBrewer qualitative (Set1/Set2/…); or sequential family "viridis" (default), "magma", "plasma", "inferno", "cividis", "turbo", plus ColorBrewer sequential/diverging (Blues, RdYlBu, …). Sequential-family names may also be used with ordinal scales (discrete sampling). When type is omitted, the named scheme selects its ordinal or sequential scale family.

reverse

boolean

Reverse the output color range. Default false.

transform

"identity" | "log10" | "sqrt"

Pre-training quantitative transform for sequential/binned color values. log10/sqrt require non-temporal values; ordinal, manual, and identity families do not accept a transform.

oob

"censor" | "squish"

Out-of-bounds policy for an explicit continuous/binned domain: "censor" (default) or "squish".

naValue

string

Color for null/missing values. Default9.

unknownValue

string

Color for invalid, out-of-domain, or unmapped values. Default9.

labels

string

Guide label format: numeric (".1f", ",d", ".0%") or temporal strftime-style text.

guide

GuideSpec

Guide presentation override (legend, colorbar, colorsteps, or none).

Guide interaction

Colorsteps guide by default for binned color. Use guide helpers or guide: "none" to suppress.

Examples

← All scales · Palettes · Scales and guides

Docs