使用FusionCharts展示高质量动画图表

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事件来显示默认图表。

沪ICP备2024098111号-1
上海秋旦网络科技中心:上海市奉贤区金大公路8218号1幢 联系电话:17898875485