flex 图表使用

columnChart 控件为例

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark"             
			   xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
	<fx:Declarations>
		<!-- 将非可视元素(例如服务、值对象)放在此处 -->
	</fx:Declarations>
	<fx:Script>
		<![CDATA[
			import mx.collections.ArrayCollection;
			
			[Bindable]             //图表数据  从后台传过来就可以制作报表了
			private var money:ArrayCollection = new ArrayCollection( [
				{ month:6, CostOfLiving:470, Play:231},
				{ month:7, CostOfLiving:500, Play:106},
				{ month:8, CostOfLiving:650, Play:43},
				{ month:9, CostOfLiving:704, Play:180},
				{ month:10, CostOfLiving:512, Play:410},
				{ month:11, CostOfLiving:823, Play:123},
			])
		]]>
	</fx:Script>
	<mx:ColumnChart id="column" type="stacked"
					dataProvider="{money}" x="215" y="90">
		<mx:horizontalAxis>     <!--水平轴-->
			<mx:CategoryAxis displayName="月份" categoryField="month" />
		</mx:horizontalAxis>
		<mx:series>         <!--Y轴-->
			<mx:ColumnSeries displayName="价格" yField="CostOfLiving">
				<mx:fill>
					<mx:RadialGradient>
						<mx:entries>
							<mx:GradientEntry  color="#f05788"  />
							<mx:GradientEntry color="#f05788" ratio="0"/>
						</mx:entries>
					</mx:RadialGradient>
				</mx:fill>
			</mx:ColumnSeries>
			<mx:ColumnSeries displayName="利润" yField="Play">
				<mx:fill>
					<mx:SolidColor color="#f08788"/>
				</mx:fill>
			</mx:ColumnSeries>
		
		</mx:series>
		
	</mx:ColumnChart>
	<mx:Legend dataProvider="{column}" x="720" y="50"/> <!--图例-->
</s:Application>


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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值