Skip to content
Gordon Woodhull edited this page Apr 1, 2019 · 9 revisions

What "shape" (or format) of data is each chart expecting?

Every chart takes the output of group.all(), i.e. an array of {key,value} pairs. However, the interpretation of the key can vary, and some charts take multiple groups.

Bubble chart and bubble overlay

By default, X and Y are driven by the keyAccessor and valueAccessor, respectively. However, these can be overridden to give bubbles some other identity function if they should move position in response to filters.

Scatter plot and heatmap

The key is an array of X and Y coordinates. This does not allow symbols/cells to change position. (#621, #702). But it seems to be necessary to implement 2D brushing for the scatter plot, since a filter can only look at the key.

Sometimes people stick the color in a third element of the key array because it's easier to create a custom key than a custom value.

Bar chart and line chart

Key is X value and value is Y value (by default). Stacking introduces extra groups which must have the same keys.

There are two alternative grouped bar proposals. One takes over the stacking data (stacking and grouping are mutually exclusive) and the other takes over the composite data (grouped+stacked is allowed, composite bar charts are not). There may be yet another data model for this.

Composite chart

All bets are off since the dimension and group can be specified independently for each child chart. However, in order for brushing to work, the keys must be consistent across charts, because the composite will tell each child chart to filter on its RangedFilter.

Series chart

The key/value array has bins for each X value in each child chart. The array is partitioned by seriesAccessor using d3.nest, and each child chart is passed a fake group containing only the items in that series.

Row chart, pie chart

The data is a flat array, where keyAccessor returns an ordinal key, and valueAccessor returns a value. The array is sorted and sliced in order to implement capping.

Box plot

Each key is an X value (ordinal or linear depending on the X scale); each value is an array of values, which d3-box sorts and computes quantiles on.

Geo Choropleth

The data is ordinal key, numeric value. Not related to data shape, but a curious thing about this chart is that it binds the geojson to the chart and keeps the group data hidden as an auxiliary data structure.

Sunburst chart

The keys are arrays specifying the path down the tree to the slice; the values drive the relative size of the slices, which aggregate back up the tree.

Select menu, checkbox menu

Standard categorical data like a pie chart or row chart (but no capping).

Data table, data grid

These usually use rows from dimension.top() instead of aggregated data, although they can also work with Crossfilter groups. The section (aka "group") function partitions the data.

Data count

Reads crossfilter.size() and groupAll.value() and displays the two numbers.

Number display

Displays value from groupAll.value() or the top bin of a group.