FusionChart动态图表开发示例说明_免费下载

企业信息化软件系列

目 录

1 动态图表组件介绍

/Report/dtbb/Gallery：此文件夹存放的是现有动态报表的示例文件 /Report/dtbb/Charts：此文件夹存放的是核心动态报表图形组件，具体图形组件的列表如下：

图形组件文件

FCF_Area2D.swf FCF_Bar2D.swf FCF_Candlestick.swf FCF_Column2D.swf FCF_Column3D.swf FCF_Doughnut2D.swf FCF_Funnel.swf FCF_Gantt.swf FCF_Line.swf FCF_MSArea2D.swf FCF_MSBar2D.swf FCF_MSColumn2D.swf FCF_MSColumn3D.swf FCF_MSLine.swf FCF_Pie2D.swf FCF_Pie3D.swf FCF_StackedArea2D.swf FCF_StackedBar2D.swf FCF_StackedColumn2D.swf FCF_StackedColumn3D.swf

2D面积图 2D条型图 蜡烛图 2D柱型图 3D柱型图 2D环型图 漏斗图 甘特图 折线图

2D面积图-多序列 2D条型图-多序列 2D柱型图-多序列 3D柱型图-多序列 线型图-多序列 2D饼型图 3D饼型图 堆叠2D面积图 堆叠2D条型图 堆叠2D柱型图 堆叠3D柱型图

组件说明

FCF_MSColumn2DLineDY.swf 2D组合图（柱型+线型） FCF_MSColumn3DLineDY.swf 3D组合图（柱型+线型）

2 使用动态图表组件设计新报表

在Report系统中，选择“参数配置》模块管理”，点击“增加”按钮，输入新模块编码（5位数字，不能与已有的重复）、模块名称、文件路径（即.aspx调用页面的存放路径，如/report/dtbb/0001.aspx）、上级模块。如下图所示，录入完成后点击“保存”按钮。

对新增报表菜单进行角色授权：打开“角色/职员》角色权限”，勾选新添加的菜单模块后“确定返回”，如下图：

刷新左侧的菜单栏或注销重新登录，即可看到新增的菜单链接，如下图所示：

复制一个现有的报表调用模板页面dsample.aspx（在\report\dtbb下），然后重命名为上一步新增报表菜单模块时输入的调用页面名称，如0001.aspx。如下图所示：

在VisualStudio中打开Report系统源文件页面，如下图所示的

0001.aspx

通过三步骤操作即可完成新页面的修改，详细操作如下： 第1步：首先批量替换当前页的00002 为新的报表模块编码，如下图所示，全部批量替换“当前文档”范围内的00002为新报表模块的编码如31123（此编码即上面新增报表菜单时的模块编码），共有4处被替换。

第2步：然后批量替换当前页的“动态报表模板”文字为新的报表模块名称。如下图所示，全部批量替换“当前文档”范围内的“动态报表模板”文字为新报表模块的名称如“测试动态报表”（此名称即上面新增报表菜单时的模块名称），共有3处被替换。

第3步：参考页面中自带的四个示例程序，结合实际需要来选择其它一个或多个图形组件来使用。虽然图形组件种类较大，但是核心的调用方法基本相同。下面我们就以最常用的柱型图对接数据源详细解释一下调用参数

首先，页面上只需要用一个Literal组件来显示图形即可。如下图所示：

然后，在Page_Load页面加载程序中调用图形生成函数如

CreateChart()

核心的图形生成函数中，常用的参数说明如下表所示：

其中graph部分的主要参数如下：

参数

caption subCaption xAxisName yAxisName decimalPrecision

showNames numberSuffix

说明 图形主标题 图形子标题 X轴显示的标题名称 Y轴显示的标题名称 小数点位数，2代表两位小数 显示X轴标题名称，0为不显示 指标后面显示的单位，如元、个、条等

Set部分的主要参数如下： 参数

name value color

说明

图形序列名称，通常为字符型 图形指标值，通常为数值型

图形的颜色值，可灵活自定义每个节点的图形颜色

最后生成图形的语法：

Charts/FCF_Column3D.swf：指定要显示的图形样式 strXML：输出图形上的数据

MyReport：可自定义的图表名称，切记如果是在同一页面有多个图形调用，此名称不

能重复，否则将无法正常显示。 600、300：即图形的长、宽尺寸。

至此，保存页面并在Report系统中点击新增的报表，即可看到效果如下图所示：

提醒：其它更多图形调用请参考/Report/Gallery/文件夹下面的示例页面进行制作，主要

的调用过程和语法都相似。

**************** 好客工作室 ***************