Packagecom.amcharts.axes
Classpublic class Guide

Guides are straight vertical or horizontal lines or areas. You can have guides both on value and category axes. Guides can be added in mxml or with [axis].addGuide(guide) method. Radar chart can also display guides. Guides of radar chart have two additional properties - angle and toAngle. If you want to change guides properties dynamically, call chart.invalidateData() after the change.

View the examples.



Public Properties
 PropertyDefined by
  angle : Number
Angle of a guide, can be used by Radar Chart only
Guide
  balloonColor : Number = 0xCC0000
Baloon fill color
Guide
  balloonText : String
the text which will be displayed if the user rolls-over the guide.
Guide
  category : String
category of the guide (in case the guide is for category axis)
Guide
  dashLength : Number
dash length
Guide
  date : Date
date of the guide (in case the guide is for category axis and parseDates is set to true)
Guide
  fillAlpha : Number
fill opacity
Guide
  fillColor : Number
fill color
Guide
  inside : Boolean
specifies whether label should be placed inside or outside plot area.
Guide
  label : String = ""
the label which will be displayed near the guide
Guide
  labelRotation : Number = 0
rotation angle of a guide label.
Guide
  lineAlpha : Number
line opacity
Guide
  lineColor : Number
line color
Guide
  lineThickness : Number
line thickness
Guide
  tickLength : Number
tick length
Guide
  toAngle : Number
"to" angle of a guide, can be used by Radar Chart only
Guide
  toCategory : String
"to" category of the guide (in case the guide is for category axis).
Guide
  toDate : Date
"to" date of the guide (in case the guide is for category axis and parseDates is set to true) If you have both date and toDate, the space between these two dates can be filled with color
Guide
  toValue : Number
"to" value of the guide (in case the guide is for value axis).
Guide
  value : Number
value of the guide (in case the guide is for value axis)
Guide
Public Methods
 MethodDefined by
  
Constructor.
Guide
Property detail
angleproperty
public var angle:Number

Angle of a guide, can be used by Radar Chart only

balloonColorproperty 
public var balloonColor:Number = 0xCC0000

Baloon fill color

The default value is 0xCC0000.

balloonTextproperty 
public var balloonText:String

the text which will be displayed if the user rolls-over the guide.

categoryproperty 
public var category:String

category of the guide (in case the guide is for category axis)

dashLengthproperty 
public var dashLength:Number

dash length

dateproperty 
public var date:Date

date of the guide (in case the guide is for category axis and parseDates is set to true)

fillAlphaproperty 
public var fillAlpha:Number

fill opacity

fillColorproperty 
public var fillColor:Number

fill color

insideproperty 
public var inside:Boolean

specifies whether label should be placed inside or outside plot area.

labelproperty 
public var label:String = ""

the label which will be displayed near the guide

labelRotationproperty 
public var labelRotation:Number = 0

rotation angle of a guide label.

lineAlphaproperty 
public var lineAlpha:Number

line opacity

lineColorproperty 
public var lineColor:Number

line color

lineThicknessproperty 
public var lineThickness:Number

line thickness

tickLengthproperty 
public var tickLength:Number

tick length

toAngleproperty 
public var toAngle:Number

"to" angle of a guide, can be used by Radar Chart only

toCategoryproperty 
public var toCategory:String

"to" category of the guide (in case the guide is for category axis). If you have both category and toCategory, the space between these two categories can be filled with color

toDateproperty 
public var toDate:Date

"to" date of the guide (in case the guide is for category axis and parseDates is set to true) If you have both date and toDate, the space between these two dates can be filled with color

toValueproperty 
public var toValue:Number

"to" value of the guide (in case the guide is for value axis). If you have both value and toValue, the space between these two values can be filled with color

valueproperty 
public var value:Number

value of the guide (in case the guide is for value axis)

Constructor detail
Guide()constructor
public function Guide()

Constructor.

Examples
guidesAsAreas
<?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"
                creationComplete="{generateChartData()}"
                width="100%"
                height="100%" viewSourceURL="srcview/index.html">
    
    <mx:Script>
        <![CDATA[
            import com.amcharts.axes.Guide;
            import com.amcharts.chartClasses.AmGraph;
            import mx.collections.ArrayCollection;
            
            
            [Bindable]
            private var chartData:ArrayCollection = new ArrayCollection(); 
            // generate some random data
            private function generateChartData():void{
                var firstDate:Date = new Date();
                firstDate.setDate(firstDate.getDate() - 20);
                
                for(var i:Number = 0; i < 20; i++){
                    var newDate:Date = new Date(firstDate);
                    newDate.setDate(newDate.getDate() + i);
                    
                    var visits:Number = Math.round(Math.random() * 40) + 100;
                    
                    chartData.addItem({date:newDate, visits:visits});
                }
                
                // create guide and add it to category axis
                var verticalGuideDate:Date = new Date();
                verticalGuideDate.setHours(0,0,0,0);
                verticalGuideDate.date -= 10;
                
                var verticalGuideToDate:Date = new Date();
                verticalGuideToDate.setHours(0,0,0,0);
                verticalGuideToDate.date -= 5;                
                
                var guide:Guide = new Guide();
                guide.date = verticalGuideDate;
                guide.toDate = verticalGuideToDate;
                guide.fillAlpha = 0.15;                                
                guide.lineAlpha = 0;
                
                catAxis.addGuide(guide);
            }
            
            [Bindable]
            private var shadow:DropShadowFilter = new DropShadowFilter(2,45,0,0.5);
            
            
        ]]>
    </mx:Script>
    
    
    <amcharts:AmSerialChart 
        id="chart" 
        width="100%" 
        height="100%" 
        autoMargins="false"
        marginTop="0" 
        marginLeft="0" 
        marginRight="0"
        marginBottom="0" 
        dataProvider="{chartData}" 
        categoryField="date">
        
        <amcharts:graphs>
            <amcharts:AmGraph id="g1" lineColor="#7717D7" title="Visits" valueField="visits" type="line" dashLength="3" lineThickness="1" bullet="round" filters="{[shadow]}"/>                        
        </amcharts:graphs>
        <amcharts:valueAxes>
            <amcharts:ValueAxis inside="true" tickLength="0">
                <!-- guides to value axes addes from mxml (can also be added with valueAxis.addGuide(guide) method -->
                <amcharts:guides>
                    <amcharts:Guide value="0" toValue="105" fillColor="#CC0000" fillAlpha="0.20" lineAlpha="0"/>
                    <amcharts:Guide value="105" toValue="110" fillColor="#CC0000" fillAlpha="0.15" lineAlpha="0"/>
                    <amcharts:Guide value="110" toValue="115" fillColor="#CC0000" fillAlpha="0.10" lineAlpha="0"/>
                    <amcharts:Guide value="115" toValue="120" fillColor="#CC0000" fillAlpha="0.05" lineAlpha="0"/>
                    <amcharts:Guide value="120" toValue="125" fillColor="#0000cc" fillAlpha="0.05" lineAlpha="0"/>
                    <amcharts:Guide value="125" toValue="130" fillColor="#0000cc" fillAlpha="0.10" lineAlpha="0"/>
                    <amcharts:Guide value="130" toValue="135" fillColor="#0000cc" fillAlpha="0.15" lineAlpha="0"/>
                    <amcharts:Guide value="135" toValue="200" fillColor="#0000cc" fillAlpha="0.20" lineAlpha="0"/>
                </amcharts:guides>                    
            </amcharts:ValueAxis>
        </amcharts:valueAxes>
        
        <amcharts:categoryAxis>
            <!-- no guides here, one is added with addGuide method -->
            <amcharts:CategoryAxis id="catAxis" parseDates="true" minPeriod="DD" inside="true" tickLength="0"/>
        </amcharts:categoryAxis>
        
        <amcharts:chartCursor>
            <amcharts:ChartCursor/>                        
        </amcharts:chartCursor>
        
        <amcharts:chartScrollbar>
            <amcharts:ChartScrollbar graph="{g1}" hideResizeGrips="false"/>                        
        </amcharts:chartScrollbar>            
    </amcharts:AmSerialChart>
    
</mx:Application>
stacked3DColumnChart
<?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="#000000"
                width="100%"
                height="100%" viewSourceURL="srcview/index.html">
    <mx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            
            [Bindable]
            private var chartData:ArrayCollection = new ArrayCollection([
                {country:"USA", year2004:3.5, year2005:4.2},
                {country:"UK", year2004:1.7, year2005:3.1},
                {country:"Canada", year2004:2.8, year2005:2.9},
                {country:"Japan", year2004:2.6, year2005:2.3},
                {country:"France", year2004:1.4, year2005:2.1},
                {country:"Brazil", year2004:2.6, year2005:4.9},
                {country:"Russia", year2004:6.4, year2005:7.2},
                {country:"India", year2004:8.0, year2005:7.1},
                {country:"China", year2004:9.9, year2005:10.1}
            ]);    
            
        ]]>
    </mx:Script>
    
    <mx:Canvas width="100%" height="100%">
        <amcharts:AmSerialChart            
            width="100%"
            height="100%"
            color="#FFFFFF"
            fontSize="14"
            id="chart"
            dataProvider="{chartData}"
            categoryField="country"
            startDuration="1"
            angle="30"
            depth3D="60"
            plotAreaFillAlphas="[0.1]">
            <amcharts:graphs>
                <amcharts:AmGraph 
                    title="2004"
                    valueField="year2004" 
                    type="column" 
                    lineAlpha="0"
                    lineColor="#D2CB00" 
                    fillAlphas="[1]"
                    balloonText="GDP grow in [[category]] (2004): [[value]]"/>    
                <amcharts:AmGraph 
                    title="2005"
                    valueField="year2005" 
                    type="column" 
                    lineAlpha="0"
                    lineColor="#BEDF66" 
                    fillAlphas="[1]"
                    balloonText="GDP grow in [[category]] (2005): [[value]]%"/>                                            
            </amcharts:graphs>
            
            <amcharts:valueAxes>
                <amcharts:ValueAxis stackType="3d" gridAlpha="0.2" gridColor="#FFFFFF" axisColor="#FFFFFF" axisAlpha="0.5" dashLength="5" unit="%">    
                    <amcharts:guides>
                        <amcharts:Guide value="4.87" lineColor="#FFFFFF" lineAlpha="1" inside="true" dashLength="0" balloonText="Average GDP grow in 2004 was 4.87%"/>
                    </amcharts:guides>                
                </amcharts:ValueAxis>
            </amcharts:valueAxes>
            
            <amcharts:categoryAxis>
                <amcharts:CategoryAxis gridPosition="start" gridAlpha="0.2" gridColor="#FFFFFF" axisColor="#FFFFFF" axisAlpha="0.5" dashLength="5" fontWeight="bold"/>
            </amcharts:categoryAxis>
            
            <amcharts:balloon>
                <amcharts:AmBalloon maximumWidth="300"/>                    
            </amcharts:balloon>
            
        </amcharts:AmSerialChart>
        
        <amcharts:AmLegend
            x="160"
            y="20" 
            fontWeight="bold"
            fontSize="14"
            textClickEnabled="false" 
            color="0xFFFFFF" 
            dataProvider="{chart}" 
            valueWidth="0" 
            marginTop="25"
            marginLeft="0" 
            marginRight="15"
            marginBottom="15"/>
    </mx:Canvas>
</mx:Application>
polarChart
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
                layout="absolute"
                backgroundColor="#FFFFFF"
                xmlns:amcharts="http://www.amcharts.com/com_internal"
                width="100%"
                height="100%" viewSourceURL="srcview/index.html">
    <mx:Script>
        <![CDATA[
            
            import mx.collections.ArrayCollection;
            
            [Bindable]
            private var chartData:ArrayCollection = new ArrayCollection([
                {direction:"N", value:8},  
                {direction:"NE", value:9},
                {direction:"E", value:4.5},  
                {direction:"SE", value:3.5},  
                {direction:"S", value:9.2},  
                {direction:"SW", value:8.4},
                {direction:"W", value:11.1},
                {direction:"NW", value:10}]); 
        ]]>
    </mx:Script>
    
    <mx:VBox width="100%" height="100%">        
        
        <amcharts:AmRadarChart id="chart" dataProvider="{chartData}" categoryField="direction" width="100%" height="100%" startDuration="1">
            <amcharts:valueAxes>
                <amcharts:ValueAxis 
                    gridType="circles" 
                    fillAlpha="0.05" 
                    fillColor="0x000000" 
                    axisAlpha="0.2" 
                    gridAlpha="0" 
                    fontWeight="bold" 
                    min="0">
                    <amcharts:guides>
                        <amcharts:Guide angle="225" tickLength="0" toAngle="315" value="0" toValue="14" fillColor="0x0066CC" fillAlpha="0.6"/>                                
                        <amcharts:Guide angle="45" tickLength="0" toAngle="135" value="0" toValue="14" fillColor="0xCC3333" fillAlpha="0.6"/>                            
                    </amcharts:guides>
                </amcharts:ValueAxis>
            </amcharts:valueAxes>
            
            <amcharts:graphs>
                <amcharts:AmGraph 
                    lineColor="0xFFCC00"
                    fillAlphas="[0.4]" 
                    bullet="round" 
                    valueField="value"
                    balloonText="[[direction]]: [[value]] m/s"/>                
            </amcharts:graphs>    
            
        </amcharts:AmRadarChart>
    </mx:VBox>
</mx:Application>