在上文“在winform中运用FusionCharts图表(一)”中,介绍了Line2D的FusionCharts图表的XML基本属性。
本文将介绍如何在WinForm中显示图表,并且通过按钮点击显示不同的图表。
在WinForm中显示SWF文件,有两种途径,一个是利用Flash控件;一个是利用WebBrowser控件;本文利用的是后者。WebBrowser控件通过显示包含SWF文件的HTML文件,来达到显示SWF文件的目的。
首先,准备好外部文件:
FusionCharts.js;这个是FusionCharts的JS文件。在官方的免费包里。
FCF_Line.swf;这个是FusionCharts的SWF文件,用来显示图表的,在官方的免费包里。
1.xml;图表数据一,自己构造的XML图表数据。
2.xml;图表数据二,自己构造的XML图表数据,和前一个文件属性相同,只是数据点的数据不同。
Line2D.html;包含SWF文件的HTML文件。内容如下:
< html xmlns ="http://www.w3.org/1999/xhtml" >
< head >
< meta http-equiv ="Content-Type" content ="text/html; charset=iso-8859-1" />
< title > FusionCharts Free Documentation </ title >
< script language ="JavaScript" src ="FusionCharts.js" ></ script >
< script language ="javascript" >
var query = location.search.substring( 5 );
</ script >
</ head >
< body style ="margin:0px;" >
< div style ="width:600px;" >
< div id ="chartdiv" align ="center" >
FusionCharts. </ div >
< script type ="text/javascript" >
var chart = new FusionCharts( " FCF_Line.swf " , " ChartId " , " 600 " , " 350 " );
chart.setDataURL(query);
chart.render( " chartdiv " );
</ script >
</ div >
</ body >
</ html >
这个文件的关键有这几个方面:
1、var query=location.search.substring(5);。这句话是JS来获取HTML的传入参数。在使用的时候,WebBrowse控件是采用Line2D.html?url=2.xml的形式,那么前面的这句话就是获得2.xml这个外部数据文件名。
2、<body style="margin:0px;">。这句话是把页面的留白去掉。
3、chart.setDataURL(query); 。这句话的意思是根据前面获得的文件名,动态的获得数据。
文件准备好后,在Winform上拖动控件,两个Button,一个WebBrowse控件。
WebBrowse控件的属性设置如下:
IsWebBrowserContextMenuEnabled = False;不显示WebBrowser的上下文菜单
Width = 600
Height = 350
ScrollBarsEnabled = False;不显示滚动条
WebBrowserShortcutsEnabled = False;不显示WebBrowser的快捷菜单。
在Form的Actived的事件中,添加如下代码,默认显示第一个图表
WebBrowser1.Navigate(Application.StartupPath & "\Line2D.html?url=1.xml")
在Button1的Click事件中,添加如下代码,显示第一个图表
WebBrowser1.Navigate(Application.StartupPath & "\Line2D.html?url=1.xml")
在Button2的Click事件中,添加如下代码,显示第二个图表
WebBrowser1.Navigate(Application.StartupPath & "\Line2D.html?url=2.xml")
至此,效果完成。下面是两个效果图。
点击Button1的效果:
点击Button2的效果:
本文转自万仓一黍博客园博客,原文链接:http://www.cnblogs.com/grenet/archive/2010/03/28/1698874.html,如需转载请自行联系原作者