StockChartLegendSettings

23 Sep 20253 minutes to read

Configures the legends in charts.

Properties

alignment Alignment

Legend in stock chart can be aligned as follows:

  • Near: Aligns the legend to the left of the stock chart.
  • Center: Aligns the legend to the center of the stock chart.
  • Far: Aligns the legend to the right of the stock chart.

Defaults to ‘Center’

background string

The background color of the legend that accepts value in hex and rgba as a valid CSS color string in stock chart.

Defaults to ‘transparent’

border StockChartBorderModel

Options to customize the border of the legend.

containerPadding ContainerPaddingModel

Options to customize left, right, top and bottom padding for legend container of the stock chart.

description string

Description for legends in stock chart.

Defaults to null

enablePages boolean

If set to true, legend will be visible using pages in stock chart.

Defaults to true

height string

The height of the legend in pixels.

Defaults to null

isInversed boolean

If set to true, legend will be Reversed in stock chart.

Defaults to false

itemPadding number

Option to customize the padding between legend items.

Defaults to null

location LocationModel

Specifies the location of the legend, relative to the Stock chart.
If x is 20, legend moves by 20 pixels to the right of the Stock chart. It requires the position to be Custom.

<div id='StockChart'></div>
let stockChart: StockChart = new StockChart({
...
  legendSettings: {
    visible: true,
    position: 'Custom',
    location: { x: 100, y: 150 },
  },
...
});
stockChart.appendTo('#StockChart');

margin StockMarginModel

Options to customize left, right, top and bottom margins of the stock chart.

maximumTitleWidth number

maximum width for the legend title in stock chart.

Defaults to 100

mode LegendMode

Mode of legend items.

  • Series: Legend items generated based on series count.
  • Point: Legend items generated based on unique data points.
  • Range: Legend items generated based on range color mapping property.
  • Gradient: Single linear bar generated based on range color mapping property.
    This property is applicable for chart component only.

opacity number

Opacity of the legend in stock chart.

Defaults to 1

padding number

Option to customize the padding around the legend items.

Defaults to 8

position LegendPosition

Position of the legend in the Stock chart are,

  • Auto: Places the legend based on area type.
  • Top: Displays the legend at the top of the stock chart.
  • Left: Displays the legend at the left of the stock chart.
  • Bottom: Displays the legend at the bottom of the stock chart.
  • Right: Displays the legend at the right of the stock chart.
  • Custom: Displays the legend based on the given x and y values.

Defaults to ‘Auto’

shapeHeight number

Shape height of the legend in pixels.

Defaults to 10

shapePadding number

Padding between the legend shape and text in stock chart.

Defaults to 8

shapeWidth number

Shape width of the legend in pixels.

Defaults to 10

tabIndex number

TabIndex value for the legend in stock chart.

Defaults to 3

textStyle StockChartFontModel

Options to customize the legend text.

title string

Title for legends in stock chart.

Defaults to null

titlePosition LegendTitlePosition

legend title position in stock chart.

Defaults to ‘Top’

titleStyle StockChartFontModel

Options to customize the legend title in stock chart.

toggleVisibility boolean

If set to true, series’ visibility collapses based on the legend visibility in stock chart.

Defaults to true

visible boolean

If set to true, legend will be visible.

Defaults to false

width string

The width of the legend in pixels.

Defaults to null