#

API Docs for:
Show: Inherited Protected Private Deprecated

# ChartLegend Class

Extends Widget
Defined in: `input/charts/ChartLegend.js:1`
Module: charts-legend
Parent Module: charts

ChartLegend provides a legend for a chart.

- Index
- Methods
- Properties
- Attributes

## Item Index

### Methods

- _destroyLegendItems
- _drawLegend
- _getDefaultStyles
- _getLegendItem
- _getPlotDefaults
- _getShapeClass
- _getStylesBySeriesType
- _handleSizeChange
- _positionChangeHandler
- _updateBackground
- _updateHandler
- bindUI
- destructor
- initializer
- renderUI
- syncUI

### Properties

- _layout

### Attributes

- background
- chart
- direction
- height
- includeInChartLayout
- position
- styles
- width
- x
- y

## Methods

### `_destroyLegendItems`

() private

Defined in `input/charts/ChartLegend.js:475`

Destroys legend items.

### `_drawLegend`

() private

Defined in `input/charts/ChartLegend.js:122`

Draws the legend

### `_getDefaultStyles`

() protected

Defined in `input/charts/ChartLegend.js:416`

Returns the default hash for the `styles` attribute.

#### Returns:

Object

### `_getLegendItem`

(

- `shapeProps`
- `shapeClass`
- `fill`
- `border`
- `text`
- `width`
- `height`
- `text`

)
private

Defined in `input/charts/ChartLegend.js:337`

Returns a legend item consisting of the following properties:

node
  The `Node` containing the legend item elements.
shape
  The `Shape` element for the legend item.
textNode
  The `Node` containing the text>
text

#### Parameters:

- `shapeProps` Node

  Reference to the `node` attribute.

- `shapeClass` String | Class

  The type of shape

- `fill` Object

  Properties for the shape's fill

- `border` Object

  Properties for the shape's border

- `text` String

  String to be rendered as the legend's text

- `width` Number

  Total width of the legend item

- `height` Number

  Total height of the legend item

- `text` HTML | String

  Text for the legendItem

#### Returns:

Object

### `_getPlotDefaults`

() protected

Defined in `input/charts/ChartLegend.js:458`

Gets the default values for series that use the utility. This method is used by the class' `styles` attribute's getter to get build default values.

#### Returns:

Object

### `_getShapeClass`

() private

Defined in `input/charts/ChartLegend.js:403`

Evaluates and returns correct class for drawing a shape.

#### Returns:

Shape

### `_getStylesBySeriesType`

(

- `The`

)
private

Defined in `input/charts/ChartLegend.js:282`

Retrieves the marker styles based on the type of series. For series that contain a marker, the marker styles are returned.

#### Parameters:

- `The` CartesianSeries | PieSeries

  series in which the style properties will be received.

#### Returns:

Object An object containing fill, border and shape information.

### `_handleSizeChange`

(

- `e`

)
private

Defined in `input/charts/ChartLegend.js:103`

Updates the legend when the size changes.

#### Parameters:

- `e` Object

  Event object.

### `_positionChangeHandler`

(

- `e`

)
private

Defined in `input/charts/ChartLegend.js:82`

Handles position changes.

#### Parameters:

- `e` Object

  Event object

### `_updateBackground`

(

- `styles`

)
private

Defined in `input/charts/ChartLegend.js:256`

Updates the background for the legend.

#### Parameters:

- `styles` Object

  Reference to the legend's styles attribute

### `_updateHandler`

(

- `e`

)
private

Defined in `input/charts/ChartLegend.js:67`

Handles changes to legend.

#### Parameters:

- `e` Object

  Event object

### `bindUI`

() private

Defined in `input/charts/ChartLegend.js:40`

### `destructor`

() protected

Defined in `input/charts/ChartLegend.js:509`

Destructor implementation ChartLegend class. Removes all items and the Graphic instance from the widget.

### `initializer`

() private

Defined in `input/charts/ChartLegend.js:10`

Initializes the chart.

### `renderUI`

() private

Defined in `input/charts/ChartLegend.js:21`

### `syncUI`

() private

Defined in `input/charts/ChartLegend.js:53`

## Properties

### `_layout`

Unknown private

Defined in `input/charts/ChartLegend.js:498`

Maps layout classes.

## Attributes

### `background`

Rect

Defined in `input/charts/ChartLegend.js:714`

Background for the legend.

### `chart`

Chart

Defined in `input/charts/ChartLegend.js:537`

Reference to the `Chart` instance.

### `direction`

String

Defined in `input/charts/ChartLegend.js:551`

Indicates the direction in relation of the legend's layout. The `direction` of the legend is determined by its `position` value.

### `height`

Number

Defined in `input/charts/ChartLegend.js:627`

The height of the legend. Depending on the implementation of the ChartLegend, this value is `readOnly`. By default, the legend is included in the layout of the `Chart` that it references. Under this circumstance, `height` is always `readOnly`. When the legend is rendered in its own dom element, the `readOnly` status is determined by the direction of the legend. If the `position` is `top` or `bottom` or the `direction` is `horizontal`, height is `readOnly`. If the position is `left` or `right` or the `direction` is `vertical`, height can be explicitly set. If height is not explicitly set, the height will be determined by the width of the legend's parent element.

### `includeInChartLayout`

Boolean private

Defined in `input/charts/ChartLegend.js:526`

Indicates whether the chart's contentBox is the parentNode for the legend.

### `position`

String

Defined in `input/charts/ChartLegend.js:562`

Indicates the position and direction of the legend. Possible values are `left`, `top`, `right` and `bottom`. Values of `left` and `right` values have a `direction` of `vertical`. Values of `top` and `bottom` values have a `direction` of `horizontal`.

### `styles`

Object

Defined in `input/charts/ChartLegend.js:722`

Properties used to display and style the ChartLegend. This attribute is inherited from `Renderer`. Below are the default values:

gap
  Distance, in pixels, between the `ChartLegend` instance and the chart's content. When `ChartLegend` is rendered within a `Chart` instance this value is applied.
hAlign
  Defines the horizontal alignment of the `items` in a `ChartLegend` rendered in a horizontal direction. This value is applied when the instance's `position` is set to top or bottom. This attribute can be set to left, center or right. The default value is center.
vAlign
  Defines the vertical alignment of the `items` in a `ChartLegend` rendered in vertical direction. This value is applied when the instance's `position` is set to left or right. The attribute can be set to top, middle or bottom. The default value is middle.
item
  Set of style properties applied to the `items` of the `ChartLegend`.
  hSpacing
    Horizontal distance, in pixels, between legend `items`.
  vSpacing
    Vertical distance, in pixels, between legend `items`.
  label
    Properties for the text of an `item`.
    color
      Color of the text. The default values is "#808080".
    fontSize
      Font size for the text. The default value is "85%".
  marker
    Properties for the `item` markers.
    width
      Specifies the width of the markers.
    height
      Specifies the height of the markers.
background
  Properties for the `ChartLegend` background.
  fill
    Properties for the background fill.
    color
      Color for the fill. The default value is "#faf9f2".
  border
    Properties for the background border.
    color
      Color for the border. The default value is "#dad8c9".
    weight
      Weight of the border. The default values is 1.

### `width`

Number

Defined in `input/charts/ChartLegend.js:588`

The width of the legend. Depending on the implementation of the ChartLegend, this value is `readOnly`. By default, the legend is included in the layout of the `Chart` that it references. Under this circumstance, `width` is always `readOnly`. When the legend is rendered in its own dom element, the `readOnly` status is determined by the direction of the legend. If the `position` is `left` or `right` or the `direction` is `vertical`, width is `readOnly`. If the position is `top` or `bottom` or the `direction` is `horizontal`, width can be explicitly set. If width is not explicitly set, the width will be determined by the width of the legend's parent element.

### `x`

Number readonly

Defined in `input/charts/ChartLegend.js:668`

Indicates the x position of legend.

### `y`

Number readonly

Defined in `input/charts/ChartLegend.js:691`

Indicates the y position of legend.