论坛首页 Java企业应用论坛

图表组件设计思路

浏览 10253 次
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2010-11-05  
hellostory 写道
最近也在做公司的一个报表查询系统,前台主要用Flash图表展示(使用FashionCharts),配合简单的表格。领导要求以后可以在前台任意添加修改报表。因此将报表的数据源等配置信息存放在数据表中,而前台Falsh展示配置使用XML文件,用户可以随时修改,如指定数据表的那个字段为X轴等

后台数据源是从数据库中查询出来的,每张报表对应一条配置记录。数据表中有一个字段存放查询SQL语句(如
select CLASS,FieldA,FieldB from T1
),而Flash的XML文件则指定查询结果集的哪个字段作为X轴上的一个系列等

报表配置文件如下:
<graph caption="材料采购分析图"
	xaxisname="类别"
	yxisName="金额"
	showValues='0'
	rotateNames='0'
	formatNumberScale='0'
	baseFontSize="12">
	<categories fieldName="CLASS" font="宋体" fontSize="14" fontColor="000000">
	</categories>
	<dataset fieldName="FieldA" seriesname="本月采购额"></dataset>
	<dataset fieldName="FieldB" seriesname="去年同期采购额"></dataset>
</graph>

其中属性“fieldName”表示引用SQL查询结果集中的哪个字段的系列值。
用户查询时,系统将根据查询结果数据,结合上面的XML文件,填充为一份完整的XML数据文件,然后传递到前台页面Flash显示

后台根据查询结果集,并根据前面的XML配置文件规则,自动生成如下完整的报表数据XML文件:
<graph caption='材料采购分析图' xaxisname="类别" yaxisname="金额" 
	rotateNames='0'					
	rotateYAxisName='0'
	formatNumberScale="0"
	baseFontSize="12">
	<categories fieldName="CLASS"  font="宋体" fontSize="14" fontColor="000000">
	  <category label="材料一" /> 
	  <category label="材料二" /> 
	  <category label="材料三" /> 
	  <category label="材料四" />
	</categories>
	<dataset fieldName="FieldA" seriesname="本月采购额">
		  <set value="100" /> 
		  <set value="200" /> 
		  <set value="300" /> 
		  <set value="220" /> 
	</dataset>
	<dataset fieldName="FieldB" seriesname="去年同期采购额">
		<set value="200" />
		<set value="150" />
		<set value="400" />
		<set value="200" />
	</dataset>
</graph>


这个报表还有待完善的地方:
1、首先需要制作一个向导页面,引导用户对Flash进行配置,最终生成一个报表配置文件(见第一个XML文件)
2、其他略



这个很不错,思路比较清晰。借鉴了!
0 请登录后投票
   发表时间:2010-11-05  
cloudzhj 写道
flex作报表挺好,加入flash还不如flex

恩,目前Flex自带的报表组件的效果和样式都不是很绚丽,需要自己手动去实现。
曾经因项目需要统一样式,我花了点时间将flex的报表效果做得和FusionCharts一样,但是这样成本太高。
0 请登录后投票
   发表时间:2010-11-05  
我们做web图表展示的时候也是通过FusionChart实现的数据轮询,动态展示的,流程和这个类似
0 请登录后投票
   发表时间:2010-11-05  
图表以前做的比较少,正好可以学习下
0 请登录后投票
   发表时间:2010-11-05  
json + google chart

http://code.google.com/apis/chart/docs/chart_playground.html
http://en.wikipedia.org/wiki/Google_Chart_API
0 请登录后投票
   发表时间:2011-06-09  
非常好 正在找这个资料
0 请登录后投票
   发表时间:2011-06-09  
这个设计更没写一样
0 请登录后投票
   发表时间:2011-06-10  
web chart未来的方向应该是SVG,与js,dom结合更天然,flash一类的可以用来过度
自己做完整组件,js级的dataset实现是有一定必要的,公司愿意做这种基础库肯下血本可以考虑弄funsion chart的源码研究吧
google chart不能去依赖这种东西,但它把数据放在请求中,用service生成图像这种设计思想也是很好的,也可以扩展到生成交互式的矢量图,这样的系统集成也会很容易,api极度简化
0 请登录后投票
论坛首页 Java企业应用版

跳转论坛:
Global site tag (gtag.js) - Google Analytics