flash图表控件FusionCharts在winform中的运用(二)

转帖|其它|编辑:郝浩|2012-01-19 23:57:08.000|阅读 831 次

概述:在上文”flash图表控件FusionCharts在winform中的运用(一)”中,介绍了Line2D的FusionCharts图表的XML基本属性。本文将介绍如何在WinForm中显示图表,并且通过按钮点击显示不同的图表。

# 界面/图表报表/文档/IDE等千款热门软控件火热销售中 >>

  在上文”flash图表控件FusionCharts在winform中的运用(一)”中,介绍了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>

  这个文件的关键有这几个方面:

  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的效果:

 


标签:

本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处、不得修改原文相关链接,如果存在内容上的异议请邮件反馈至chenjj@evget.com

文章转载自:网络转载

为你推荐

  • 推荐视频
  • 推荐活动
  • 推荐产品
  • 推荐文章
  • 慧都慧问
扫码咨询


添加微信 立即咨询

电话咨询

客服热线
023-68661681

TOP