Home > Docs > chart.link

chart.link

Configuration Structure

chart: {
  link: { ... },
    enabled: boolean,
    mode: 'highlight' | 'filter',
    dimOpacity: number,
    id: string,
    dimension: Function,
    reduce: 'count' | object | ...,
    type: 'category' | 'range' | ...,
    bins: { ... },
      width: number,
      count: number,
      thresholds: number[],
    order: 'first-seen' | 'asc' | ...,
    seriesName: string,
}

The link options coordinate a group of charts that share the same chart.group. In highlight mode, brushing or hovering one chart dims the non-matching marks in the others with no redraw. In filter mode (selected by setting dimension), each chart declares a dimension and reduction over a shared record set registered with ApexCharts.crossfilter({ id, records }); clicking a bucket re-aggregates every other participating chart. It needs the link feature (import 'apexcharts/features/link'). See the Linked views guide. It is part of the chart configuration.

enabled

chart.link.enabled
Default: false

Enable coordination for this chart. Requires import 'apexcharts/features/link'.

mode

chart.link.mode
Default: 'highlight'

highlight (default) dims non-matching marks in the group. filter runs the crossfilter engine. Filter mode is also selected automatically when dimension is set.

dimOpacity

chart.link.dimOpacity
Default: 0.2

Opacity applied to dimmed (unselected or out-of-range) marks in highlight mode.

id

chart.link.id

Filter mode: the crossfilter coordinator id. Defaults to chart.group.

dimension

chart.link.dimension

Filter mode: (row) => key. Its presence selects filter mode. For a heatmap (matrix) dimension it returns [xKey, yKey].

reduce

chart.link.reduce
Default: 'count'

Filter mode: the reduction over a bucket's rows. 'count' (default), an object like { sum: 'field' } / { avg } / { min } / { max }, or a function (rows) => number.

type

chart.link.type

Filter mode: bucket kind, 'category', 'range', or 'matrix'. When omitted it is inferred: bins present means range, a heatmap chart means matrix (2D), otherwise category.

bins

chart.link.bins

Filter mode (range dimensions): binning spec, { width, count, thresholds }.

order

chart.link.order
Default: 'first-seen'

Filter mode (category dimensions): key ordering, 'first-seen' (default), 'asc', 'desc', or a comparator function.

seriesName

chart.link.seriesName
Default: 'Count'

Filter mode (axis charts): the name given to the derived aggregated series.

sum

Object form of link.reduce: the row field to sum over each bucket.

avg

Object form of link.reduce: the row field to average over each bucket.

min

Object form of link.reduce: the row field to take the minimum of over each bucket.

max

Object form of link.reduce: the row field to take the maximum of over each bucket.

width

chart.link.bins.width

Fixed bin width for a range dimension. Use this or count, not both.

count

chart.link.bins.count

Number of bins to divide the range dimension into.

thresholds

chart.link.bins.thresholds

Explicit bin edges, for unequal buckets that width or count cannot express.