JavaScript/jQuery Funnel - legend

Default Value: undefined

This option supports the following colors:

Hexadecimal colors
RGB colors
RGBA colors
Predefined/cross-browser color names
Predefined SVG colors

border

Configures the legend's border.

Type:

columnCount

Arranges legend items into several columns.

Type:

Default Value: 0

Use this option when the legend is oriented vertically. Otherwise, use rowCount.

columnItemSpacing

Specifies an empty space between item columns in pixels.

Type:

Default Value: 20

customizeHint

Specifies the hint that appears when a user hovers the mouse pointer over a legend item.

Type:

Function

Function parameters:

itemInfo:

Information on the funnel item and its corresponding legend item.

Object structure:

Name	Type	Description
item	Funnel Item	The Item object.
text	String	The legend item's text.

Return Value:

The text to be displayed in the hint.

This option accepts a function that must return the required text. When implementing this function, use its parameter to access the information on the series that corresponds to the legend item.

customizeText

Customizes the text displayed by legend items.

Type:

Function

Function parameters:

itemInfo:

Information on the funnel item and its corresponding legend item.

Object structure:

Name	Type	Description
item	Funnel Item	The Item object.
text	String	The legend item's original text.

Return Value:

The text for the legend item to display.

Cannot be used in themes.

NOTE

As an alternative to the function’s parameter you can use the this keyword.

font

Specifies the legend items' font options.

Type:

horizontalAlignment

Along with verticalAlignment, specifies the legend's position.

Type:

Default Value: 'right'

Accepted Values: 'center' | 'left' | 'right'

When using the widget as an ASP.NET MVC Control, specify this option using the HorizontalAlignment enum. This enum accepts the following values: Left, Center and Right.

itemsAlignment

Aligns items in the last column or row (depending on the legend's orientation). Applies when legend items are not divided into columns or rows equally.

Type:

Default Value: undefined

Accepted Values: 'center' | 'left' | 'right'

When using the widget as an ASP.NET MVC Control, specify this option using the HorizontalAlignment enum. This enum accepts the following values: Left, Center and Right.

itemTextPosition

Specifies the text's position relative to the marker in a legend item.

Type:

Default Value: undefined

Accepted Values: 'bottom' | 'left' | 'right' | 'top'

margin

Generates an empty space, measured in pixels, around the legend.

Type:

|

Default Value: 10

When set to a number, this option applies to all the legend's sides. The object allows you to control each side individually.

DevExtreme Legend Margins

markerSize

Specifies the marker's size in a legend item in pixels.

Type:

Default Value: 20

orientation

Arranges legend items vertically (in a column) or horizontally (in a row). The default value is "horizontal" if the legend.horizontalAlignment is "center". Otherwise, it is "vertical".

Type:

Default Value: undefined

Accepted Values: 'horizontal' | 'vertical'

When using the widget as an ASP.NET MVC Control, specify this option using the Orientation enum. This enum accepts the following values: Horizontal and Vertical.

paddingLeftRight

Generates an empty space, measured in pixels, between the legend's left/right border and its items.

Type:

Default Value: 10

DevExtreme Legend Left-Right Padding

paddingTopBottom

Generates an empty space, measured in pixels, between the legend's top/bottom border and its items.

Type:

Default Value: 10

DevExtreme Legend Top-Bottom Padding

rowCount

Arranges legend items in several rows.

Type:

Default Value: 0

Use this option when the legend is oriented horizontally. Otherwise, use columnCount.

rowItemSpacing

Specifies an empty space between item rows in pixels.

Type:

Default Value: 8

verticalAlignment

Along with horizontalAlignment, specifies the legend's position.

Type: