dc.js

Class: legend

dc. legend

new legend()

Legend is a attachable widget that can be added to other dc charts to render horizontal legend labels.

Examples:

Source:
Returns:
Type
dc.legend
Example
chart.legend(dc.legend().x(400).y(10).itemHeight(13).gap(5))

Methods

autoItemWidth( [autoItemWidth])

Turn automatic width for legend items on or off. If true, itemWidth is ignored. This setting takes into account the gap.

Parameters:
Name Type Argument Default Description
autoItemWidth Boolean <optional>
 false
Source:
Returns:
Type
Boolean | dc.legend

gap( [gap])

Set or get gap between legend items.

Parameters:
Name Type Argument Default Description
gap Number <optional>
 5
Source:
Returns:
Type
Number | dc.legend

highlightSelected( [highlightSelected])

This can be optionally used to enable highlighting legends for the selections/filters for the chart.

Parameters:
Name Type Argument Description
highlightSelected String <optional>
Source:
Returns:
Type
String | dc.legend

horizontal( [horizontal])

Position legend horizontally instead of vertically.

Parameters:
Name Type Argument Default Description
horizontal Boolean <optional>
 false
Source:
Returns:
Type
Boolean | dc.legend

itemHeight( [itemHeight])

Set or get legend item height.

Parameters:
Name Type Argument Default Description
itemHeight Number <optional>
 12
Source:
Returns:
Type
Number | dc.legend

itemWidth( [itemWidth])

Legend item width for horizontal legend.

Parameters:
Name Type Argument Default Description
itemWidth Number <optional>
 70
Source:
Returns:
Type
Number | dc.legend

legendText( [legendText])

Set or get the legend text function. The legend widget uses this function to render the legend text for each item. If no function is specified the legend widget will display the names associated with each group.

Parameters:
Name Type Argument Description
legendText function <optional>
Source:
Returns:
Type
function | dc.legend
Example
// default legendText
legend.legendText(dc.pluck('name'))

// create numbered legend items
chart.legend(dc.legend().legendText(function(d, i) { return i + '. ' + d.name; }))

// create legend displaying group counts
chart.legend(dc.legend().legendText(function(d) { return d.name + ': ' d.data; }))

legendWidth( [legendWidth])

Maximum width for horizontal legend.

Parameters:
Name Type Argument Default Description
legendWidth Number <optional>
 500
Source:
Returns:
Type
Number | dc.legend

maxItems( [maxItems])

Maximum number of legend items to display

Parameters:
Name Type Argument Description
maxItems Number <optional>
Source:
Returns:
Type
dc.legend

x( [x])

Set or get x coordinate for legend widget.

Parameters:
Name Type Argument Default Description
x Number <optional>
 0
Source:
Returns:
Type
Number | dc.legend

y( [y])

Set or get y coordinate for legend widget.

Parameters:
Name Type Argument Default Description
y Number <optional>
 0
Source:
Returns:
Type
Number | dc.legend