com.amcharts.AmLegend

	Property	Defined by
		adjustWidth : Boolean If adjustWidth is true, the legend will srink so that it would take only space needed for all the entries.	AmLegend
		dataProvider : AmChart [write-only] Data provider of the legend is the chart object.	AmLegend
		labelText : String The text which will be displayed in the legend.	AmLegend
		numberFormatter : NumberFormatter An instance of mx.formatters.NumberFormatter.	AmLegend
		percentFormatter : NumberFormatter An instance of mx.formatters.NumberFormatter.	AmLegend
		textClickEnabled : Boolean Specifies whether the legend text is clickable or not.	AmLegend
		useMarkerColorForLabels : Boolean Specifies if legend labels should be use same color as corresponding markers.	AmLegend
		usePositiveNegativeOnPercentsOnly : Boolean If positiveValueColor and negativeValueColor styles are defined, legend value changes it's color depending on the value.	AmLegend
		valueFunction : Function You can set custom function which will format your value text using this property	AmLegend
		valueText : String The text which will be displayed in the value portion of the legend.	AmLegend

	Method	Defined by
		AmLegend() Constructor.	AmLegend
		setActualSize(w:Number, h:Number):void	AmLegend

Summary	Defined by
clickLabel	Dispatched when user clicks on a legend item label.	AmLegend
clickMarker	Dispatched when user clicks on a legend item marker (and the switchable is set to "false").	AmLegend
hideItem	Dispatched when user clicks on a legend item marker and hides corresponding object.	AmLegend
rollOutItem	Dispatched when user rolls-out of the legend item label (or whole item, if switchable is set to false).	AmLegend
rollOutMarker	Dispatched when user rolls-out of the legend item marker.	AmLegend
rollOverItem	Dispatched when user rolls-over the legend item label (or whole item, if switchable is set to false).	AmLegend
rollOverMarker	Dispatched when user rolls-over the legend item marker.	AmLegend
showItem	Dispatched when user clicks on a legend item marker and shows corresponding object.	AmLegend

Styles

	Description	Defined by
align	Type: String CSS Inheritance: no Alignment of legend entries. Possible values are: left, center, right. The default value is `left`.	AmLegend
backgroundAlpha	Type: Number CSS Inheritance: no Background opacity. The default value is `0`.	AmLegend
backgroundColor	Type: uint Format: Color CSS Inheritance: no Background color. You should set backgrounAlpha > 0 in order to see the background. The default value is `0xFFFFFF`.	AmLegend
borderAlpha	Type: Number CSS Inheritance: no Border opacity.	AmLegend
borderColor	Type: uint Format: Color CSS Inheritance: no Border color. #default 0xDDDDDD	AmLegend
color	Type: uint Format: Color CSS Inheritance: yes Color of text in the component, including the component label. The default value is `0x0B333C`.	AmLegend
disabledColor	Type: uint Format: Color CSS Inheritance: yes Color of text in the component if it is disabled. The default value is `0xAAB3B3`.	AmLegend
fontAntiAliasType	Type: String CSS Inheritance: yes Sets the `antiAliasType` property of internal TextFields. The possible values are `"normal"` (`flash.text.AntiAliasType.NORMAL`) and `"advanced"` (`flash.text.AntiAliasType.ADVANCED`). The default value is `"advanced"`, which enables advanced anti-aliasing for the font. Set to `"normal"` to disable the advanced anti-aliasing. This style has no effect for system fonts. This style applies to all the text in a TextField subcontrol; you cannot apply it to some characters and not others. The default value is `"advanced"`.	AmLegend
fontFamily	Type: String CSS Inheritance: yes Name of the font to use. Unlike in a full CSS implementation, comma-separated lists are not supported. You can use any font family name. If you specify a generic font name, it is converted to an appropriate device font. The default value is `"Verdana"`.	AmLegend
fontGridFitType	Type: String CSS Inheritance: yes Sets the `gridFitType` property of internal TextFields that represent text in Flex controls. The possible values are `"none"` (`flash.text.GridFitType.NONE`), `"pixel"` (`flash.text.GridFitType.PIXEL`), and `"subpixel"` (`flash.text.GridFitType.SUBPIXEL`). This property only applies when you are using an embedded font and the `fontAntiAliasType` property is set to `"advanced"`. This style has no effect for system fonts. This style applies to all the text in a TextField subcontrol; you can't apply it to some characters and not others. The default value is `"pixel"`.	AmLegend
fontSharpness	Type: Number CSS Inheritance: yes Sets the `sharpness` property of internal TextFields that represent text in Flex controls. This property specifies the sharpness of the glyph edges. The possible values are Numbers from -400 through 400. This property only applies when you are using an embedded font and the `fontAntiAliasType` property is set to `"advanced"`. This style has no effect for system fonts. This style applies to all the text in a TextField subcontrol; you can't apply it to some characters and not others. The default value is `0`.	AmLegend
fontSize	Type: Number Format: Length CSS Inheritance: yes Height of the text, in pixels. The default value is 10 for all controls except the ColorPicker control. For the ColorPicker control, the default value is 11.	AmLegend
fontStyle	Type: String CSS Inheritance: yes Determines whether the text is italic font. Recognized values are `"normal"` and `"italic"`. The default value is `"normal"`.	AmLegend
fontThickness	Type: Number CSS Inheritance: yes Sets the `thickness` property of internal TextFields that represent text in Flex controls. This property specifies the thickness of the glyph edges. The possible values are Numbers from -200 to 200. This property only applies when you are using an embedded font and the `fontAntiAliasType` property is set to `"advanced"`. This style has no effect on system fonts. This style applies to all the text in a TextField subcontrol; you can't apply it to some characters and not others. The default value is `0`.	AmLegend
fontWeight	Type: String CSS Inheritance: yes Determines whether the text is boldface. Recognized values are `normal` and `bold`. The default value for Button controls is `bold`. The default value for all other controls is `normal`.	AmLegend
horizontalGap	Type: Number CSS Inheritance: no Horizontal space between legend items, in pixels. The default value is `10`.	AmLegend
kerning	Type: Boolean CSS Inheritance: yes A Boolean value that indicates whether kerning is enabled (`true`) or disabled (`false`). Kerning adjusts the gap between certain character pairs to improve readability, and should be used only when necessary, such as with headings in large fonts. Kerning is supported for embedded fonts only. Certain fonts, such as Verdana, and monospaced fonts, such as Courier New, do not support kerning. The default value is `false`.	AmLegend
letterSpacing	Type: Number CSS Inheritance: yes The number of additional pixels to appear between each character. A positive value increases the character spacing beyond the normal spacing, while a negative value decreases it. The default value is `0`.	AmLegend
marginBottom	Type: Number CSS Inheritance: no Space below the last row of the legend, in pixels. The default value is `10`.	AmLegend
marginLeft	Type: Number CSS Inheritance: no Space on the left from the first column of the legend. In case you use legend with Rectangular chart, make it the same as marginLeft of the chart - the legend will start with the vertical axis in this case. The default value is `80`.	AmLegend
marginRight	Type: Number CSS Inheritance: no Space on the right from the last column of the legend. In case you use legend with Rectangular chart, make it the same as marginRight of the chart - the legend will end with the plot area in this case. The default value is `80`.	AmLegend
marginTop	Type: Number CSS Inheritance: no Space above the first row of the legend, in pixels. The default value is `10`.	AmLegend
markerBorderColor	Type: uint Format: Color CSS Inheritance: no Marker border color. By default, border will be the same color as marker. The default value is `NaN`.	AmLegend
markerBorderThickness	Type: Number CSS Inheritance: no 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. The default value is `0`.	AmLegend
markerDisabledColor	Type: uint Format: Color CSS Inheritance: no The color of the disabled marker (when the graph is hidden). The default value is `0xAAB3B3`.	AmLegend
markerLabelGap	Type: Number CSS Inheritance: no Space between legend marker and legend text, in pixels. The default value is `5`.	AmLegend
markerSize	Type: Number CSS Inheritance: no Size of the legend marker (key). The default value is `16`.	AmLegend
markerType	Type: String CSS Inheritance: no Shape of the legend marker (key). Possible values are: square, circle, line, dashedLine, triangleUp, triangleDown, bubble, none. The default value is `square`.	AmLegend
maxColumns	Type: Number CSS Inheritance: no Maximum number of columns in the legend. The default value is `NaN`.	AmLegend
negativeValueColor	Type: uint Format: Color CSS Inheritance: no Value text color if value is negative. The default value is `undefined`.	AmLegend
positiveValueColor	Type: uint Format: Color CSS Inheritance: no Value text color if value is positive. The default value is `undefined`.	AmLegend
reversedOrder	Type: Boolean CSS Inheritance: no Specifies whether legend entries should be placed in reversed order. The default value is `false`.	AmLegend
rollOverColor	Type: uint Format: Color CSS Inheritance: yes Legend item text color on roll-over. The default value is `0xCC0000`.	AmLegend
rollOverGraphAlpha	Type: Number CSS Inheritance: no 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 graphs. The default value is `1`.	AmLegend
switchable	Type: Boolean CSS Inheritance: no Whether showing/hiding of graphs by clicking on the legend marker is enabled or not. The default value is `true`.	AmLegend
switchColor	Type: uint Format: Color CSS Inheritance: no legend switch color. The default value is `0xFFFFFF`.	AmLegend
switchType	Type: String CSS Inheritance: no legend switch type (in case the legend is switchable). Possible values are x and v. The default value is `x`.	AmLegend
textAlign	Type: String CSS Inheritance: yes Alignment of text within a container. Possible values are `"left"`, `"right"`, or `"center"`. The default value for most components is `"left"`. For the FormItem component, the default value is `"right"`. For the Button, LinkButton, and AccordionHeader components, the default value is `"center"`, and this property is only recognized when the `labelPlacement` property is set to `"left"` or `"right"`. If `labelPlacement` is set to `"top"` or `"bottom"`, the text and any icon are centered.	AmLegend
textDecoration	Type: String CSS Inheritance: yes Determines whether the text is underlined. Possible values are `"none"` and `"underline"`. The default value is `"none"`.	AmLegend
textIndent	Type: Number Format: Length CSS Inheritance: yes Offset of first line of text from the left side of the container, in pixels. The default value is `0`.	AmLegend
valueAlign	Type: String CSS Inheritance: no Alignment of the value text. Possible values are left and right. The default value is `right`.	AmLegend
valueWidth	Type: Number CSS Inheritance: no Width of the value text. The default value is `80`.	AmLegend
verticalGap	Type: Number CSS Inheritance: no Vertical space between legend items, in pixels. The default value is `10`.	AmLegend

Property detail

adjustWidth

property

adjustWidth:Boolean [read-write]

If adjustWidth is true, the legend will srink so that it would take only space needed for all the entries. useful with horizontal layout and when maxColumns is set.

The default value is false.

Implementation
public function get adjustWidth():Boolean
public function set adjustWidth(value:Boolean):void

dataProvider

property

dataProvider:AmChart [write-only]

Data provider of the legend is the chart object.

Implementation
public function set dataProvider(value:AmChart):void

labelText

property

labelText:String [read-write]

The text which will be displayed in the legend. Tag [[title]] will be replaced with the title of the graph.

The default value is [[title]].

Implementation
public function get labelText():String
public function set labelText(value:String):void

numberFormatter

property

numberFormatter:NumberFormatter [read-write]

An instance of mx.formatters.NumberFormatter. The control use this class to format the numbers.

The default value is mx.formatters.NumberFormatter.

Implementation
public function get numberFormatter():NumberFormatter
public function set numberFormatter(value:NumberFormatter):void

percentFormatter

property

percentFormatter:NumberFormatter [read-write]

An instance of mx.formatters.NumberFormatter. The control use this class to format the percent numbers.

The default value is mx.formatters.NumberFormatter with precision = 1.

Implementation
public function get percentFormatter():NumberFormatter
public function set percentFormatter(value:NumberFormatter):void

textClickEnabled

property

textClickEnabled:Boolean [read-write]

Specifies whether the legend text is clickable or not. Clicking on legend text can show/hide value balloons or pull-out/pull-in slices of pie chart.

The default value is true.

Implementation
public function get textClickEnabled():Boolean
public function set textClickEnabled(value:Boolean):void

useMarkerColorForLabels

property

useMarkerColorForLabels:Boolean [read-write]

Specifies if legend labels should be use same color as corresponding markers.

The default value is false.

Implementation
public function get useMarkerColorForLabels():Boolean
public function set useMarkerColorForLabels(value:Boolean):void

usePositiveNegativeOnPercentsOnly

property

usePositiveNegativeOnPercentsOnly:Boolean [read-write]

If positiveValueColor and negativeValueColor styles are defined, legend value changes it's color depending on the value. However sometimes users might want to use this feature only when graph's values are recalculated to percents. Set this to true in this case.

The default value is false.

Implementation
public function get usePositiveNegativeOnPercentsOnly():Boolean
public function set usePositiveNegativeOnPercentsOnly(value:Boolean):void

valueFunction

property

valueFunction:Function [read-write]

You can set custom function which will format your value text using this property

The default value is undefined.

Implementation
public function get valueFunction():Function
public function set valueFunction(value:Function):void

valueText

property

valueText:String [read-write]

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]].

The default value is [[value]].

Implementation
public function get valueText():String
public function set valueText(value:String):void

Constructor detail

AmLegend

()

constructor

public function AmLegend()

Constructor.

Method detail

setActualSize

()

method

public override function setActualSize(w:Number, h:Number):voidParameters

	`w:Number`

	`h:Number`

Event detail

clickLabel

event

Event object type: com.amcharts.events.LegendEvent

Dispatched when user clicks on a legend item label.

clickMarker

event

Event object type: com.amcharts.events.LegendEvent

Dispatched when user clicks on a legend item marker (and the switchable is set to "false").

hideItem

event

Event object type: com.amcharts.events.LegendEvent

Dispatched when user clicks on a legend item marker and hides corresponding object.

rollOutItem

event

Event object type: com.amcharts.events.LegendEvent

Dispatched when user rolls-out of the legend item label (or whole item, if switchable is set to false).

rollOutMarker

event

Event object type: com.amcharts.events.LegendEvent

Dispatched when user rolls-out of the legend item marker.

rollOverItem

event

Event object type: com.amcharts.events.LegendEvent

Dispatched when user rolls-over the legend item label (or whole item, if switchable is set to false).

rollOverMarker

event

Event object type: com.amcharts.events.LegendEvent

Dispatched when user rolls-over the legend item marker.

showItem

event

Event object type: com.amcharts.events.LegendEvent

Dispatched when user clicks on a legend item marker and shows corresponding object.

Examples

chartWithLegend

<?xml version="1.0" encoding="utf-8"?>
<mx:Application 
    xmlns:mx="http://www.adobe.com/2006/mxml" 
    xmlns:amcharts="http://www.amcharts.com/com_internal"
    layout="absolute" 
    backgroundColor="#FFFFFF"
    width="100%"
    height="100%" viewSourceURL="srcview/index.html">        
    
    <mx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            
            [Bindable]
            private var chartData:ArrayCollection = new ArrayCollection([
                {year:2005,income:23.5,expenses:18.1},
                {year:2006,income:26.2,expenses:22.8},
                {year:2007,income:30.1,expenses:23.9},
                {year:2008,income:29.5,expenses:25.1},
                {year:2009,income:24.6,expenses:25.0}
            ]);    
            
        ]]>
    </mx:Script>
    
    <mx:VBox width="100%" height="100%">
        <amcharts:AmSerialChart 
            width="100%"
            height="100%" 
            id="chart" 
            dataProvider="{chartData}" 
            categoryField="year" 
            startDuration="1" 
            angle="30" 
            depth3D="30">
            
            <amcharts:categoryAxis>
                <amcharts:CategoryAxis gridPosition="start"/>
            </amcharts:categoryAxis>
            
            <amcharts:graphs>
                <amcharts:AmGraph title="Income" id="g0" valueField="income" type="column" lineAlpha="0" fillAlphas="[1]"/>                        
                <amcharts:AmGraph title="Expenses" id="g1" valueField="expenses" type="line" lineThickness="2" bullet="round"/>                        
            </amcharts:graphs>
        </amcharts:AmSerialChart>
        <!-- You can position the Legend anywhere you want. Use Flex layout components to do this.
        For example, if you'd like to have your legend on the left or on the right, you should use HBox instead of VBox -->
        <amcharts:AmLegend dataProvider="{chart}" width="100%" switchType="v" marginLeft="35" textClickEnabled="false" marginBottom="15"/>                     
    </mx:VBox>    
</mx:Application>

stackedAreaChart

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
                xmlns:amcharts="http://www.amcharts.com/com_internal"
                layout="absolute"
                backgroundColor="#FFFFFF"
                width="100%"
                height="100%" viewSourceURL="srcview/index.html">
    
    <mx:Script> 
        <![CDATA[
            import mx.collections.ArrayCollection;
            
            [Bindable]
            private var chartData:ArrayCollection = new ArrayCollection([
                {year:"2000",a:20,b:5,c:10,d:5},
                {year:"2001",a:21,b:6,c:10,d:10},
                {year:"2002",a:24,b:7,c:9,d:10},
                {year:"2003",a:21,b:5,c:10,d:8},
                {year:"2004",a:24,b:4,c:10,d:8},
                {year:"2005",a:26,b:8,c:10,d:9},
                {year:"2006",a:27,b:9,c:12,d:9},
                {year:"2007",a:29,b:9,c:13,d:8},
                {year:"2008",a:30,b:10,c:14,d:7},
                {year:"2009",a:26,b:12,c:15,d:8},
                {year:"2010",a:24,b:11,c:13,d:9},
                {year:"2011",a:22,b:14,c:11,d:8},
                {year:"2012",a:21,b:16,c:11,d:7},
                {year:"2013",a:20,b:17,c:13,d:6}, 
                {year:"2014",a:15,b:19,c:13,d:5},
                {year:"2015",a:14,b:18,c:14,d:3}
                
            ]);    
            
        ]]>
    </mx:Script>
    
    <mx:HBox backgroundColor="#FFFFFF" width="100%" height="100%">
        <mx:VBox width="50%" height="100%">                
            <!-- first chart -->
            <amcharts:AmSerialChart
                width="100%"
                height="100%"
                id="chart"
                dataProvider="{chartData}"
                categoryField="year"
                plotAreaFillAlphas="[0]">
                <amcharts:graphs>
                    <amcharts:AmGraph 
                        color="#FFFFFF" 
                        title="Sample a" 
                        valueField="a" 
                        type="line" 
                        lineThickness="2"
                        lineAlpha="1" 
                        fillAlphas="[0.7]"
                        showBalloon="false"/>                        
                    <amcharts:AmGraph 
                        color="#FFFFFF" 
                        title="Sample b" 
                        valueField="b" 
                        type="line" 
                        lineThickness="2"
                        lineAlpha="1" 
                        fillAlphas="[0.7]"/>
                    <amcharts:AmGraph 
                        color="#FFFFFF" 
                        title="Sample c" 
                        valueField="c" 
                        type="line" 
                        lineThickness="2"
                        lineAlpha="1" 
                        fillAlphas="[0.7]"
                        showBalloon="false"/>
                    <amcharts:AmGraph 
                        color="#FFFFFF" 
                        title="Sample d" 
                        valueField="d" 
                        type="line" 
                        lineThickness="2"
                        lineAlpha="1"
                        fillAlphas="[0.7]"/>
                </amcharts:graphs>
                
                <amcharts:valueAxes>
                    <amcharts:ValueAxis stackType="regular" gridAlpha="0.1"/>                    
                </amcharts:valueAxes>
                
                <amcharts:categoryAxis>
                    <amcharts:CategoryAxis gridAlpha="0.1" fontWeight="bold" startOnAxis="true" position="top"/>
                </amcharts:categoryAxis>
                
                <amcharts:chartScrollbar>
                    <amcharts:ChartScrollbar height="20"/>                    
                </amcharts:chartScrollbar>
                
                <amcharts:chartCursor>
                    <amcharts:ChartCursor/>                    
                </amcharts:chartCursor>
                
            </amcharts:AmSerialChart>
            
            <amcharts:AmLegend 
                fontWeight="bold"
                reversedOrder="true" 
                rollOverGraphAlpha="0.1" 
                dataProvider="{chart}" 
                width="100%"
                marginLeft="35"
                marginRight="15"
                markerType="circle"
                switchType="v"/>
            
        </mx:VBox>
        
        <mx:VBox width="50%" height="100%">
            <!-- Second chart - almost the same, only rotated -->
            <amcharts:AmSerialChart
                rotate="true"
                width="100%"
                height="100%"
                id="chart2"
                dataProvider="{chartData}"
                categoryField="year"
                plotAreaFillAlphas="[0]">
                <amcharts:graphs>
                    <amcharts:AmGraph 
                        color="#FFFFFF" 
                        title="Sample a" 
                        valueField="a" 
                        type="step" 
                        lineThickness="2"
                        lineAlpha="1" 
                        fillAlphas="[0.7]"
                        balloonText="[[percents]]%"/>                        
                    <amcharts:AmGraph 
                        color="#FFFFFF" 
                        title="Sample b" 
                        valueField="b" 
                        type="step" 
                        lineThickness="2"
                        lineAlpha="1" 
                        fillAlphas="[0.7]"
                        showBalloon="false"
                        balloonText="[[percents]]%"/>
                    <amcharts:AmGraph 
                        color="#FFFFFF" 
                        title="Sample c" 
                        valueField="c" 
                        type="step" 
                        lineThickness="2"
                        lineAlpha="1" 
                        fillAlphas="[0.7]"
                        showBalloon="false"
                        balloonText="[[percents]]%"/>
                    <amcharts:AmGraph 
                        color="#FFFFFF" 
                        title="Sample d" 
                        valueField="d" 
                        type="step" 
                        lineThickness="2"
                        lineAlpha="1"
                        fillAlphas="[0.7]"
                        balloonText="[[percents]]%"/>
                </amcharts:graphs>
                
                <amcharts:valueAxes>
                    <amcharts:ValueAxis stackType="100%" gridAlpha="0.1"/>                    
                </amcharts:valueAxes>
                
                <amcharts:categoryAxis>
                    <amcharts:CategoryAxis gridAlpha="0.1" fontWeight="bold" startOnAxis="true" position="left"/>
                </amcharts:categoryAxis>
                
                <amcharts:chartScrollbar>
                    <amcharts:ChartScrollbar height="20"/>                    
                </amcharts:chartScrollbar>
                
                <amcharts:chartCursor>
                    <amcharts:ChartCursor/>                    
                </amcharts:chartCursor>
                
            </amcharts:AmSerialChart>
            
            <amcharts:AmLegend 
                markerType="square"
                fontWeight="bold"
                reversedOrder="true" 
                rollOverGraphAlpha="0.1" 
                dataProvider="{chart2}" 
                width="100%"
                marginLeft="52"
                marginRight="15"
                switchType="x"
                valueText="[[percents]]%"
                valueAlign="right"/>                
        </mx:VBox>            
    </mx:HBox>
    
</mx:Application>

amCharts Flex components documentation	All Packages \| All Classes \| Index \| Frames No Frames
Class AmLegend	Properties \| Methods \| Events \| Styles \| Examples

Package	com.amcharts
Class	public class AmLegend
Inheritance	AmLegend mx.core.UIComponent