This is the documentation for , which is no longer actively maintained.View latest version
<dy-legend>
A component for displaying a legend or key for charts, maps, or other data visualizations. It helps users understand the meaning of different elements in your visualization by providing clear labels and indicators.
Example
Loading...
<dy-legend .legends=${
[
{"label":"Label 1"},
{"label":"Label 2"},
{"label":"Label 3"}
]
} @change=${(evt) => evt.target.value = evt.detail}></dy-legend>
API
DuoyunLegendElement
Extends DuoyunScrollBaseElement
DuoyunLegendElement Instance Properties
| Property(Attribute) |
Reactive |
Type |
colors |
Yes |
``#${string}[] |
legends |
Yes |
Legend[] |
value |
Yes |
string[] |
change |
|
Emitter<string[]> |
DuoyunLegendElement Other
Shadow DOM; Extends TapResizeBaseElement
| Property(Attribute) |
Reactive |
Type |
disableScrollMask(disable-scroll-mask) |
Yes |
boolean |
| Type |
Value |
| CSS State |
top-overflow, right-overflow, bottom-overflow, left-overflow |
TapResizeBaseElement
Extends GemElement
TapResizeBaseElement Instance Properties
| Property(Attribute) |
Reactive |
Type |
resize |
|
Emitter<ResizeDetail> |
resizeThrottle |
Yes |
boolean |
borderBoxSize |
|
{ blockSize: number; inlineSize: number; } |
contentRect |
|
{ x: number; y: number; height: number; width: number; } |
TapResizeBaseElement Other
