Flex中LineChart

关键点是数据源的设置,可以设置为动态的数据源,从外界读取信息,然后进行绑定,以及设置相应的属性值,坐标值.

.mxml文件

mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Script>
 <![CDATA[
  import mx.collections.ArrayCollection;
  [Bindable]

          //可以设置相应的动态数据源
          private var expensesAC:ArrayCollection = new ArrayCollection( [
            { Month: "Jan", Profit: 2000, Expenses: 1500, Amount: 450 },
            { Month: "Feb", Profit: 1000, Expenses: 200, Amount: 600 },
            { Month: "Mar", Profit: 1500, Expenses: 500, Amount: 300 },
            { Month: "Apr", Profit: 1800, Expenses: 1200, Amount: 900 },
            { Month: "May", Profit: 2400, Expenses: 575, Amount: 500 } ]);
 ]]>
</mx:Script>
 <mx:Panel width="100%" height="100%" layout="absolute" title="GridLineShow">
  <mx:LineChart x="82" y="0" id="linechart" showDataTips="true" dataProvider="{expensesAC}" width="792" height="354">
  <mx:horizontalAxis>
  <mx:CategoryAxis categoryField="Month"/>
  </mx:horizontalAxis>
  <mx:backgroundElements>
   <mx:GridLines direction="horizontal">
    <mx:horizontalStroke>
     <mx:Stroke weight="1"/>
    </mx:horizontalStroke>
    <mx:horizontalFill>
     <mx:SolidColor color="0xCCCCCC" alpha=".66"/>
    </mx:horizontalFill>
   </mx:GridLines>
  </mx:backgroundElements>
   <mx:series>
    <mx:LineSeries displayName="Profit" yField="Profit"/>
    <mx:LineSeries displayName="Expenses" yField="Expenses"/>
    <mx:LineSeries displayName="Amount" yField="Amount"/>
   </mx:series>
  </mx:LineChart>
  <mx:Legend dataProvider="{linechart}"/>
 </mx:Panel>
 
</mx:Application>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值