Use for displaying chart legends with interactive item selection.
currencyRoundcurrency-roundControls when numbers displayed as currency, if they are whole numbers, they will not include the .00.
dataAn array of objects that contain the data to be displayed.
formatThe format of the value displayed in the legend.
hoveredItemIdhovered-item-idThe id of the item to set as hovered.
selectedItemIdselected-item-idThe id of the item to set as selected.
The q2-legend element exposes events that can be used to send and receive data from the component based on user interaction.
Emitted when a legend item is clicked.
DonutChartDataEmitted when the mouse enters a legend item.
DonutChartDataEmitted when the mouse leaves a legend item.
DonutChartDataThis component uses other components in the Tecton library, including:
click-elsewhereOther components in the Tecton library use this component, including:
q2-chart-donutThe following CSS variables are available to override the default theme styles of the q2-legend component.
Many Tecton components consume other components to maintain visual and functional consistency. If you are looking for a CSS variable you think should exist but are not seeing it, it may be defined in one of the dependent components below. Either way, if you think it's something we should expose more conveniently, let us know!
The changelog provides a detailed history of new features, improvements, and bug fixes going back to Tecton 1.30.0. If the button is disabled, it indicates there have been no detectable changes since then.