dc.js Mixin: colorMixin (original) (raw)
dc. colorMixin
The Color Mixin is an abstract chart functional class providing universal coloring support as a mix-in for any concrete chart implementation.
Source:
Methods
calculateColorDomain()
Set the domain by determining the min and max values as retrieved by.colorAccessor over the chart's dataset.
Source:
Returns:
Type
colorAccessor( [colorAccessor])
Set or the get color accessor function. This function will be used to map a data point in a crossfilter group to a color value on the color scale. The default function uses the key accessor.
Parameters:
| Name | Type | Argument | Description |
|---|---|---|---|
| colorAccessor | function |
Source:
Returns:
Type
function|dc.colorMixin
Example
// default index based color accessor .colorAccessor(function (d, i){return i;}) // color accessor for a multi-value crossfilter reduction .colorAccessor(function (d){return d.value.absGain;})
colorCalculator( [colorCalculator])
Overrides the color selection algorithm, replacing it with a simple function.
Normally colors will be determined by calling the colorAccessor to get a value, and then passing that value through the colorScale.
But sometimes it is difficult to get a color scale to produce the desired effect. The colorCalculatortakes the datum and index and returns a color directly.
Parameters:
| Name | Type | Argument | Description |
|---|---|---|---|
| colorCalculator | * |
Source:
Returns:
Type
function|dc.colorMixin
colorDomain( [domain])
Set or get the current domain for the color mapping function. The domain must be supplied as an array.
Note: previously this method accepted a callback function. Instead you may use a custom scale set by .colors.
Parameters:
| Name | Type | Argument | Description |
|---|---|---|---|
| domain | Array. |
Source:
Returns:
Type
Array.|dc.colorMixin
colors( [colorScale])
Retrieve current color scale or set a new color scale. This methods accepts any function that operates like a d3 scale.
Parameters:
| Name | Type | Argument | Default | Description |
|---|---|---|---|---|
| colorScale | d3.scale | d3.scaleOrdinal(d3.schemeCategory20c) |
Source:
See:
Returns:
Type
d3.scale|dc.colorMixin
Example
// alternate categorical scale chart.colors(d3.scale.category20b()); // ordinal scale chart.colors(d3.scaleOrdinal().range(['red','green','blue'])); // convenience method, the same as above chart.ordinalColors(['red','green','blue']); // set a linear scale chart.linearColors(["#4575b4", "#ffffbf", "#a50026"]);
getColor(d [, i])
Get the color for the datum d and counter i. This is used internally by charts to retrieve a color.
Parameters:
| Name | Type | Argument | Description |
|---|---|---|---|
| d | * | ||
| i | Number |
Source:
Returns:
Type
String
linearColors(r)
Convenience method to set the color scale to an Hcl interpolated linear scale with range r.
Parameters:
| Name | Type | Description |
|---|---|---|
| r | Array. |
Source:
Returns:
Type
ordinalColors(r)
Convenience method to set the color scale tod3.scaleOrdinal with range r.
Parameters:
| Name | Type | Description |
|---|---|---|
| r | Array. |
Source:
Returns:
Type