dc.js

Mixin: StackMixin

StackMixin

Stack Mixin is an mixin that provides cross-chart support of stackability using d3.stack.

Mixes In:
Source:

Methods

evadeDomainFilter( [evadeDomainFilter])

Since dc.js 2.0, there has been an issue where points are filtered to the current domain. While this is a useful optimization, it is incorrectly implemented: the next point outside the domain is required in order to draw lines that are clipped to the bounds, as well as bars that are partly clipped.

A fix will be included in dc.js 2.1.x, but a workaround is needed for dc.js 2.0 and until that fix is published, so set this flag to skip any filtering of points.

Once the bug is fixed, this flag will have no effect, and it will be deprecated.

Parameters:
Name Type Argument Default Description
evadeDomainFilter Boolean <optional>
 false
Source:
Returns:
Type
Boolean | StackMixin

hidableStacks( [hidableStacks])

Allow named stacks to be hidden or shown by clicking on legend items. This does not affect the behavior of hideStack or showStack.

Parameters:
Name Type Argument Default Description
hidableStacks Boolean <optional>
 false
Source:
Returns:
Type
Boolean | StackMixin

hideStack(stackName)

Hide all stacks on the chart with the given name. The chart must be re-rendered for this change to appear.

Parameters:
Name Type Description
stackName String
Source:
Returns:
Type
StackMixin

showStack(stackName)

Show all stacks on the chart with the given name. The chart must be re-rendered for this change to appear.

Parameters:
Name Type Description
stackName String
Source:
Returns:
Type
StackMixin

stack(group [, name] [, accessor])

Stack a new crossfilter group onto this chart with an optional custom value accessor. All stacks in the same chart will share the same key accessor and therefore the same set of keys.

For example, in a stacked bar chart, the bars of each stack will be positioned using the same set of keys on the x axis, while stacked vertically. If name is specified then it will be used to generate the legend label.

Parameters:
Name Type Argument Description
group crossfilter.group
name String <optional>
accessor function <optional>
Source:
See:
Returns:
Type
Array.<{group: crossfilter.group, name: String, accessor: function()}> | StackMixin
Example
// stack group using default accessor
chart.stack(valueSumGroup)
// stack group using custom accessor
.stack(avgByDayGroup, function(d){return d.value.avgByDay;});

stackLayout( [_stack])

Gets or sets the stack layout algorithm, which computes a baseline for each stack and propagates it to the next.

Parameters:
Name Type Argument Default Description
_stack function <optional>
 d3.stackD3v3
Source:
See:
Returns:
Type
function | StackMixin

title( [stackName] [, titleAccessor])

Set or get the title function. Chart class will use this function to render svg title (usually interpreted by browser as tooltips) for each child element in the chart, i.e. a slice in a pie chart or a bubble in a bubble chart. Almost every chart supports title function however in grid coordinate chart you need to turn off brush in order to use title otherwise the brush layer will block tooltip trigger.

If the first argument is a stack name, the title function will get or set the title for that stack. If stackName is not provided, the first stack is implied.

Parameters:
Name Type Argument Description
stackName String <optional>
titleAccessor function <optional>
Source:
Returns:
Type
String | StackMixin
Example
// set a title function on 'first stack'
chart.title('first stack', function(d) { return d.key + ': ' + d.value; });
// get a title function from 'second stack'
var secondTitleFunction = chart.title('second stack');