Flex Charts（AreaChart 和LineChart）的使用方法

最新推荐文章于 2020-10-09 00:44:29 发布

wang2003feng800

最新推荐文章于 2020-10-09 00:44:29 发布

阅读量2.7k

点赞数

分类专栏： Flex 和ActionScript3.0 开发文章标签： charts flex application layout

本文链接：https://blog.csdn.net/wang2003feng800/article/details/2956487

版权

Flex 和ActionScript3.0 开发专栏收录该内容

5 篇文章

订阅专栏

 
 <?xml version="Chart1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:Script>
        <![CDATA[
        import mx.collections.ArrayCollection;
        [Bindable]
        private var expensesAC:ArrayCollection = new ArrayCollection( [
            { Month: "Jan", Profit: 2100, Expenses: 1500, Amount: 450 },
            { Month: "Feb", Profit: 1300, Expenses: 900, Amount: 900 },
            { Month: "Mar", Profit: 1800, Expenses: 800, Amount: 900 },
            { Month: "Apr", Profit: 9800, Expenses: 1200, Amount: 900 },
            { Month: "May", Profit: 3400, Expenses: 575, Amount: 500 } ]);
        ]]>
    </mx:Script>
    <!-- Define custom colors for use as fills in the AreaChart control. -->
    <mx:SolidColor id="sc1" color="blue" alpha=".3"/>
    <mx:SolidColor id="sc2" color="red" alpha=".3"/>
    <mx:SolidColor id="sc3" color="green" alpha=".3"/>
    <!-- Define custom Strokes. -->
    <mx:Stroke id = "s1" color="blue" weight="2"/>
    <mx:Stroke id = "s2" color="red" weight="2"/>
    <mx:Stroke id = "s3" color="green" weight="2"/>
    <mx:Panel title="LineChart and AreaChart Controls Example" 
        height="100%" width="100%" layout="horizontal">
        <mx:LineChart id="linechart" height="100%" width="45%"
            paddingLeft="5" paddingRight="5" 
            showDataTips="true" dataProvider="{expensesAC}">
                
            <mx:horizontalAxis>
                <mx:CategoryAxis categoryField="Month"/>
            </mx:horizontalAxis>
            <mx:series>
                <mx:LineSeries yField="Profit" form="curve" displayName="盈利" lineStroke="{s1}"/>
                <mx:LineSeries yField="Expenses" form="curve" displayName="花费" lineStroke="{s2}"/>
                <mx:LineSeries yField="Amount" form="curve" displayName="总额" lineStroke="{s3}"/>
            </mx:series>
        </mx:LineChart>
        <mx:Legend dataProvider="{linechart}"/>
        <mx:AreaChart id="Areachart" height="100%" width="45%"
             paddingLeft="5" paddingRight="5" 
             showDataTips="true" dataProvider="{expensesAC}">
                 
            <mx:horizontalAxis>
                <mx:CategoryAxis categoryField="Month"/>
            </mx:horizontalAxis>
            <mx:series>
                <mx:AreaSeries yField="Profit" form="curve" displayName="盈利" areaStroke="{s1}" areaFill="{sc1}"/>
                <mx:AreaSeries yField="Expenses" form="curve" displayName="花费" areaStroke="{s2}" areaFill="{sc2}"/>
                <mx:AreaSeries yField="Amount" form="curve" displayName="总额" areaStroke="{s3}" areaFill="{sc3}"/>
            </mx:series>
        </mx:AreaChart>
            
        <mx:Legend dataProvider="{Areachart}"/>
    </mx:Panel>
</mx:Application>
 