FusionCharts是一个用于展示高质量动画图表的组件,它可以与多种脚本语言一起使用,如PHP、ASP.NET、JSP、ColdFusion、JavaScript等。以下是FusionCharts的一些主要优势:
无需安装:FusionCharts无需安装,只需将swf文件复制到服务器上即可。
易于使用:FusionCharts非常容易使用,无需学习Flash或其他任何创作工具即可使用FusionCharts。只需要使用XML来定义数据。
多平台运行:由于FusionCharts基于XML,它们可以在多种平台上运行。
高效性:FusionCharts使用Flash在客户端渲染,因此不会造成网络拥堵和服务器负载。
免费:FusionCharts免费版完全免费。
为了演示FusionCharts的工作原理,创建了一个使用C#的ASP.NET Web应用程序。该应用程序展示了基于人均GDP的世界上最富有的10个国家。该应用程序使用Visual Web Developer 2005 Express Edition创建。
数据来自2011-2012年,来源于国际货币基金组织,它使用每个国家的人均GDP数据,数据来源网站如下:
应用程序的用户界面包括一个DropDownList控件,允许用户选择图表类型,以及一个Literal控件,用于显示选定的图表。DropDownList控件的AutoPostBack属性设置为True,以便在选定不同的图表类型时自动触发PostBack。
FusionCharts包中包含一个名为FusionCharts.dll的文件。在解决方案中添加对此文件的引用,如下所示:
在解决方案中添加了一个名为Data的文件夹,并在文件夹中添加了一个新的XML文件Data.xml,内容如下:
<?xml version="1.0" encoding="utf-8" ?>
<graph caption="Top 10 Richest Countries of the World" xAxisName="Country" yAxisName="GDP" showNames="1" decimalPrecision="0" formatNumberScale="0">
<set name="Qatar" value="102768" color="#FF0000" />
<set name="Luxembourg" value="80679" color="#00FF00" />
<set name="Singapore" value="60883" color="#0000FF" />
<set name="Norway" value="55264" color="#00FFFF" />
<set name="Brunei" value="50526" color="#FF00FF" />
<set name="United States" value="49802" color="#FFFF00" />
<set name="UAE" value="48992" color="#FFAAFF" />
<set name="Switzerland" value="45285" color="#CCFFBB" />
<set name="Kuwait" value="43846" color="#00AABB" />
<set name="Austria" value="42477" color="#BBCCFF" />
</graph>
接下来,在名为FusionCharts的文件夹中添加了FusionCharts包Charts文件夹中的所有图表swf文件。
以下是添加上述内容后解决方案资源管理器的图形:
以下是Default.aspx.cs文件中的代码:
C# using System; using System.Data; using System.Configuration; using System.Web; using System.Web.Security; using System.Web.UI; using System.Web.UI.WebControls; using System.Web.UI.WebControls.WebParts; using System.Web.UI.HtmlControls; using InfoSoftGlobal; public partial class _Default : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { // Display default chart DropDownList1_SelectedIndexChanged(sender, e); } void ShowChart(string type) { // Render chart Literal1.Text = FusionCharts.RenderChartHTML("FusionCharts/" + type + ".swf", "Data/Data.xml", "", "countries", "700", "300", false); } protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e) { // Display chart selected by the user ShowChart(DropDownList1.SelectedValue); } }
在上面的代码中,从FusionCharts.dll文件中导入了InfoSoftGlobal命名空间。这个命名空间包含了FusionCharts类。ShowChart()用户定义的函数渲染图表,并使用FusionCharts类的RenderChartHTML函数在Literal控件上显示输出。DropDownList控件的SelectedIndexChanged事件将用户选定的图表类型作为参数传递给ShowChart函数。Page_Load事件通过调用DropDownList控件的SelectedIndexChanged事件来显示默认图表。