Legend - Steema/TeeChartJS GitHub Wiki

The indicator where series names and series points are displayed is called the Legend.

Several properties can be used to customize the legend behaviour and appearance. Ie:

Chart1.legend.visible = true;
Chart1.legend.transparent = false;
Chart1.legend.format.fill = “yellow”;

Legend position and orientation

Chart1.legend.position = “left”;   // “top”, “bottom”, “right”
Chart1.legend.inverted = false;     // draws items in normal order

Select what to display at legend

Chart1.legend.legendStyle = “values”;    // “auto”, “series”, “values”
Chart1.legend.textStyle = “percentlabel”;     // show point value as percent, and point text label

Font and formatting

Chart1.legend.format.font.style = “20px Arial”;

Margins to chart top and chart axes

Chart1.legend.align = 0;    // distance from chart edge, percentage from 0 to 100 ( 0 means automatic )
Chart1.legend.padding = 5;  // distance from legend to axes in pixels

Title text on top of items

Chart1.legend.title.text = “My Legend”;
Chart1.legend.title.visible = true;

Symbols next to legend items

Chart1.legend.symbol.visible = true;
Chart1.legend.symbol.width = 20;
Chart1.legend.symbol.format.shadow.width = 5;

Other legend properties

Chart1.legend.fontColor = true;   // each item text is painted using its point or series color
Chart1.dividing.fill = “blue”;    // draws lines between legend items