Type class
Creates the legend for the chart, automatically adapts the color settings of the graphs.
Example
var chart = AmCharts.makeChart("chartdiv",{ ... "legend": { "useGraphSettings": true }, });
Inheritance
AmLegend does not extend any other symbol.
AmLegend is extended by StockLegend
.
Properties
accessibleLabel # |
Type Default Text which screen readers will read if user rolls-over the element or sets focus on it using tab key (this is possible only if tabIndex property of AmLegend is set to some number). Text is added as aria-label tag. Note - not all screen readers and browsers support this. |
---|---|
align # |
Type Default Alignment of legend entries. Possible values are: "left", "center", "right". |
autoMargins # |
Type Default Used if chart is Serial or XY. In case true, margins of the legend are adjusted and made equal to chart's margins. |
backgroundAlpha # |
Type Default Opacity of legend's background. Value range is 0 - 1 |
backgroundColor # |
Type Default Background color. You should set backgroundAlpha to >0 vallue in order background to be visible. |
borderAlpha # |
Type Default Opacity of chart's border. Value range is 0 - 1. |
borderColor # |
Type Default Color of legend's border. You should set borderAlpha >0 in order border to be visible. |
bottom # |
Type In case legend position is set to "absolute", you can set distance from bottom of the chart, in pixels. |
color # |
Type Default Text color. |
combineLegend # |
Type Default If you set it to true, and you have some legend items set using legend.data property, both graph’s entries and those added using data property will be displayed. |
data # |
Type You can pass array of objects with title, color, markerType values, for example: [{title: "One", color: "#3366CC"},{title: "Two", color: "#FFCC33"}] |
divId # |
Type You can set id of a div or a reference to div object in case you want the legend to be placed in a separate container. |
enabled # |
Type Default Specifies if legend is enabled or not. |
equalWidths # |
Type Default Specifies if each of legend entry should be equal to the most wide entry. Won't look good if legend has more than one line. |
fontSize # |
Type Default Font size. |
forceWidth # |
Type Default If you set this property to true, width of legend item labels won't be adjusted. Useful when you have more than one chart and want to align all the legends. |
gradientRotation # |
Type Can be used if legend uses custom data. Set it to 0, 90, 180 or 270. |
horizontalGap # |
Type Default Horizontal space between legend item and left/right border. |
labelText # |
Type Default The text which will be displayed in the legend. Tag [[title]] will be replaced with the title of the graph. |
labelWidth # |
Type If width of the label is bigger than labelWidth, it will be wrapped. |
left # |
Type In case legend position is set to "absolute", you can set distance from left side of the chart, in pixels. |
listeners # |
Type You can add listeners of events using this property. Example: listeners = [{"event":"clickLabel", "method":handleEvent}]; |
marginBottom # |
Type Default Bottom margin. |
marginLeft # |
Type Default Left margin. This property will be ignored if chart is Serial or XY and autoMargins property of the legend is true (default). |
marginRight # |
Type Default Right margin. This property will be ignored if chart is Serial or XY and autoMargins property of the legend is true (default). |
marginTop # |
Type Default Top margin. |
markerBorderAlpha # |
Type Default Marker border opacity. |
markerBorderColor # |
Type Marker border color. If not set, will use the same color as marker. |
markerBorderThickness # |
Type Default Thickness of the legend border. The default value (0) means the line will be a "hairline" (1 px). In case marker type is line, this style will be used for line thickness. |
markerDisabledColor # |
Type Default The color of the disabled marker (when the graph is hidden). |
markerLabelGap # |
Type Default Space between legend marker and legend text, in pixels. |
markerSize # |
Type Default Size of the legend marker (key). |
markerType # |
Type Default Shape of the legend marker (key). Possible values are: square, circle, diamond, triangleUp, triangleDown, triangleLeft, triangleDown, bubble, line, none. |
maxColumns # |
Type Maximum number of columns in the legend. If Legend's position is set to "right" or "left", maxColumns is automatically set to 1. |
periodValueText # |
Type The text which will be displayed in the value portion of the legend when user is not hovering above any data point. The tags should be made out of two parts - the name of a field (value / open / close / high / low) and the value of the period you want to be show - open / close / high / low / sum / average / count. For example: [[value.sum]] means that sum of all data points of value field in the selected period will be displayed. |
position # |
Type Default Position of a legend. Possible values are: "bottom", "top", "left", "right" and "absolute". In case "absolute", you should set left and top properties too. (this setting is ignored in Stock charts). In case legend is used with AmMap, position is set to "absolute" automatically. |
reversedOrder # |
Type Default Specifies whether legend entries should be placed in reversed order. |
right # |
Type In case legend position is set to "absolute", you can set distance from right side of the chart, in pixels. |
rollOverColor # |
Type Default Legend item text color on roll-over. |
rollOverGraphAlpha # |
Type Default When you roll-over the legend entry, all other graphs can reduce their opacity, so that the graph you rolled-over would be distinguished. This style specifies the opacity of the non-hovered graphs. |
showEntries # |
Type Default You can use this property to turn all the legend entries off. |
spacing # |
Type Default Horizontal space between legend items, in pixels. |
switchable # |
Type Default Whether showing/hiding of graphs by clicking on the legend marker is enabled or not. In case legend is used with AmMap, this is set to false automatically. |
switchColor # |
Type Default Legend switch color. |
switchType # |
Type Default Legend switch type (in case the legend is switchable). Possible values are "x" and "v". |
tabIndex # |
Type In case you set it to some number, the chart will set focus on legend entry when user clicks tab key. When a focus is set, screen readers like NVDA Screen reader will read label which is set using accessibleLabel property of AmLegend. If legend has switchable set to true, pressing Enter (Return) key will show/hide the graph. Note, not all browsers and readers support this. |
textClickEnabled # |
Type Default If true, clicking on the text will show/hide balloon of the graph. Otherwise it will show/hide graph/slice, if switchable is set to true. |
top # |
Type In case legend position is set to "absolute", you can set distance from top of the chart, in pixels. |
useGraphSettings # |
Type Default Legend markers can mirror graph’s settings, displaying a line and a real bullet as in the graph itself. Set this property to true if you want to enable this feature. Note, if you set graph colors in dataProvider, they will not be reflected in the marker. |
useMarkerColorForLabels # |
Type Default Labels will use marker color if you set this to true. |
useMarkerColorForValues # |
Type Default Specifies if legend values should be use same color as corresponding markers. |
valueAlign # |
Type Default Alignment of the value text. Possible values are "left" and "right". |
valueFunction # |
You can use it to format value labels in any way you want. Legend will call this method and will pass GraphDataItem and formatted text of currently hovered item (works only with ChartCursor added to the chart). This method should return string which will be displayed as value in the legend. |
valueText # |
Type Default The text which will be displayed in the value portion of the legend. You can use tags like [[value]], [[open]], [[high]], [[low]], [[close]], [[percents]], [[description]]. |
valueWidth # |
Type Default Width of the value text. |
verticalGap # |
Type Default Vertical space between legend items also between legend border and first and last legend row. |
width # |
Type Width of a legend, when position is set to absolute. |
Methods
addListener( |
Returns Adds event listener to the object. type - string like 'clickLabel' (should be listed in 'events' section of this class or classes which extend this class). handler - function which is called when event happens |
---|---|
removeListener( |
Returns Removes event listener from the legend object. |
Events
#clickLabel |
Param Dispatched when legend label is clicked. |
---|---|
#clickMarker |
Param Dispatched when legend marker is clicked. |
#hideItem |
Param Dispatched when user clicks on a legend item marker and hides corresponding object. |
#rollOutItem |
Param Dispatched when user rolls-out of the legend item label (or whole item, if switchable is set to false). |
#rollOverItem |
Param Dispatched when user rolls-over the legend item label (or whole item, if switchable is set to false). |
#rollOverMarker |
Param Dispatched when user rolls-over the legend item marker. |
#showItem |
Param Dispatched when user clicks on a legend item marker and shows corresponding object. |
Adapters
AmLegend does not have any adapters.