Vue Funnel - Legend

Configures the legend.

import { DxFunnelTypes } from "devextreme-vue/funnel"

customizeHint

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

Type:

Function

Function parameters:
itemInfo:

Object

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:

String

The text to be displayed in the hint.

customizeItems

Allows you to change the order, text, and visibility of legend items.

Type:

Function

Function parameters:
items:

Array<FunnelLegendItem>

Legend items before customizations.

Return Value:

Array<FunnelLegendItem>

Legend items after customizations.

customizeText

Customizes the text displayed by legend items.

Type:

Function

Function parameters:
itemInfo:

Object

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:

String

The text for the legend item to display.

Cannot be used in themes.

markerTemplate

Specifies an SVG element that serves as a custom legend item marker.

Type:

template

Template Data:

FunnelLegendItem

Information about a legend item.

Default Name: undefined

visible

Specifies whether the legend is visible.

Type:

Boolean

Default Value: false