Silverlight实用窍门系列:15.Visifire图表控件的使用二(DataPoint点击事件和Legend文字标注栏的点击事件)【附带源码实例】
2011-02-28 16:46
951 查看
图表应用于表现数据量,进行直观的对比,但是在某一些领域中如果数据之间大小差异过大,那么会出现某一些数据因为过小,而无法让用户看见的情况。例如在统计一组用户电脑的网络发包量的时候,有一些用户开启电脑几十个小时,有一些用户开启电脑几秒钟。很明显用户开机几十个小时的发包量巨大,而开机几秒钟的发包量极小,如果放在一个Visifire的图标中组成一个统计列的时候,发包量小的电脑几乎看不见了。这种情况下,我们就可以通过点击文字标注栏的Legend文字来确定某一个在图表上看不见的用户电脑的发包量。
首先我们设置一个实体类,该类包含(ComputerName,NetWorkNum)两个属性,分别代码电脑名和电脑网络发包量:
再实例化该类形成多个实体类对象集合,MainPage.xaml.cs的构造函数中敲入代码如下:
现在用户电脑数据已经准备好了,我们开始制作一个函数,此函数创建一个图表并且设置相应的Legend文字标注栏的事件绑定:
关键在于Lengend事件的设置,那么下面我们贴出Lengend被点击事件和DataPoint被点击事件的处理函数:
如此就解决了本文开头所述的图标绘制的问题。本实例采用VS2010+Silverlight 4.0编写,点击 SLTOVisiFire.rar 下载源码。运行效果如下:
首先我们设置一个实体类,该类包含(ComputerName,NetWorkNum)两个属性,分别代码电脑名和电脑网络发包量:
/// <summary> /// 电脑信息 /// </summary> public class ComputerInfomation { string _ComputerName; string _NetWorkNum; /// <summary> /// 电脑名称 /// </summary> public string ComputerName { get { return _ComputerName; } set { _ComputerName = value; } } /// <summary> /// 网络发送包 /// </summary> public string NetWorkNum { get { return _NetWorkNum; } set { _NetWorkNum = value; } } }
再实例化该类形成多个实体类对象集合,MainPage.xaml.cs的构造函数中敲入代码如下:
ComputerList = new List<ComputerInfomation>() { new ComputerInfomation(){ComputerName="张三的电脑", NetWorkNum="32143242223"}, new ComputerInfomation(){ComputerName="李四的电脑", NetWorkNum="23432423"}, new ComputerInfomation(){ComputerName="王五的电脑", NetWorkNum="12342342344"}, new ComputerInfomation(){ComputerName="刘六的电脑", NetWorkNum="562342"}, new ComputerInfomation(){ComputerName="林七的电脑", NetWorkNum="55353453445"}, new ComputerInfomation(){ComputerName="马林的电脑", NetWorkNum="2454555543"} }; BindChart(ComputerList);
现在用户电脑数据已经准备好了,我们开始制作一个函数,此函数创建一个图表并且设置相应的Legend文字标注栏的事件绑定:
List<ComputerInfomation> ComputerList = new List<ComputerInfomation>(); /// <summary> /// 绑定一个图标 /// </summary> /// <param name="computerList">用户电脑类实体集合</param> public void BindChart( List<ComputerInfomation> computerList) { Chart chart = new Chart(); chart.Width = 400; chart.Height = 550; chart.Name = "Chart"; chart.SetValue(Canvas.LeftProperty, 30.0); chart.SetValue(Canvas.TopProperty, 30.0); chart.Theme = "Theme1";//设置皮肤 chart.BorderBrush = new SolidColorBrush(Colors.Gray); chart.AnimatedUpdate = true; chart.CornerRadius = new CornerRadius(7); chart.ShadowEnabled = true; chart.Padding = new Thickness(4, 4, 4, 10); #region 设置Title Title title = new Title(); title.Text = "电脑网络发包统计"; chart.Titles.Add(title); #endregion #region 设置AxesX Axis xAxis = new Axis(); xAxis.Title = "用户电脑"; chart.AxesX.Add(xAxis); #endregion #region 设置AxesY Axis yAxis = new Axis(); yAxis.Title = "用户网卡发送包"; yAxis.Prefix = "发送:"; yAxis.Suffix = "包"; chart.AxesY.Add(yAxis); #endregion #region 设置PlotArea PlotArea plot = new PlotArea(); plot.ShadowEnabled = false; chart.PlotArea = plot; #endregion #region 设置Legends Legend legend = new Legend(); //Legend文字标注栏绑定一个事件Legend_MouseLeftButtonDown legend.MouseLeftButtonDown += new EventHandler<LegendMouseButtonEventArgs>(Legend_MouseLeftButtonDown); chart.Legends.Add(legend); #endregion #region Visifire.Charts.ToolTip tip = new Visifire.Charts.ToolTip(); tip.VerticalAlignment = VerticalAlignment.Bottom; chart.ToolTips.Add(tip); #endregion #region 创建数据序列和数据点 foreach (ComputerInfomation cominfo in computerList) { DataSeries dseries = new DataSeries(); //设置一个数据序列的LengendText值为ComputerName dseries.LegendText = cominfo.ComputerName; //设置图表的类型为RenderAs.StackedColumn dseries.RenderAs = RenderAs.StackedColumn; //设置一个数据点 DataPoint dpointUpload = new DataPoint(); //数据点的Y坐标值 dpointUpload.YValue =double.Parse(cominfo.NetWorkNum); //数据点的Tag值也为电脑名称,用于数据点被点击后对比判断当前点击的点 dpointUpload.Tag = cominfo.ComputerName; //设置数据点被点击之后触发事件Dpoint_MouseLeftButtonDown dpointUpload.MouseLeftButtonDown += new MouseButtonEventHandler(Dpoint_MouseLeftButtonDown); dseries.DataPoints.Add(dpointUpload); chart.Series.Add(dseries); } #endregion #region 设置遮罩,将Visifire的LOGO遮挡住。 StackPanel sp = new StackPanel(); sp.Width = 145; sp.Height = 15; sp.Margin = new Thickness(0, 3, 3, 0); sp.VerticalAlignment = VerticalAlignment.Top; sp.HorizontalAlignment = HorizontalAlignment.Right; sp.Background = new SolidColorBrush(Colors.White); #endregion LayoutRoot.Children.Add(chart); LayoutRoot.Children.Add(sp); }
关键在于Lengend事件的设置,那么下面我们贴出Lengend被点击事件和DataPoint被点击事件的处理函数:
/// <summary> /// DataPoint被点击执行事件 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> void Dpoint_MouseLeftButtonDown(object sender, MouseButtonEventArgs e) { //接收到当前被点击的LengendText的值 DataPoint dpoint = sender as DataPoint; string str = dpoint.Tag.ToString(); foreach (ComputerInfomation cominfo in ComputerList) { if (str == cominfo.ComputerName) { MessageBox.Show(cominfo.ComputerName + "网络发送:" + cominfo.NetWorkNum + "数据包"); } } } /// <summary> /// Legend文字被点击执行的事件 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> private void Legend_MouseLeftButtonDown(object sender, LegendMouseButtonEventArgs e) { //接收到当前被点击的LengendText的值 string str = e.DataSeries.LegendText.ToString(); foreach (ComputerInfomation cominfo in ComputerList) { if (str == cominfo.ComputerName) { MessageBox.Show(cominfo.ComputerName + "网络发送:" + cominfo.NetWorkNum + "数据包"); } } }
如此就解决了本文开头所述的图标绘制的问题。本实例采用VS2010+Silverlight 4.0编写,点击 SLTOVisiFire.rar 下载源码。运行效果如下:
相关文章推荐
- 15.Visifire图表控件的使用二(DataPoint点击事件和Legend文字标注栏的点击事件)
- Silverlight实用窍门系列:14.Visifire图表控件的使用一(图表的创建和基础使用)【附带源码实例】
- Silverlight实用窍门系列:39.Silverlight中使用Frame和Page控件制作导航【附带实例源码】
- Silverlight实用窍门系列:39.Silverlight中使用Frame和Page控件制作导航【附带实例源码】
- Silverlight实用窍门系列:12.继承于某些固定控件(以Grid为例)的鼠标左键双击事件的实现【附带实例源码】
- Silverlight实用窍门系列:1.Silverlight读取外部XML加载配置---(使用WebClient读取XAP包同目录下的XML文件))【附带实例源码】
- Silverlight实用窍门系列:13.基于Popup浮动窗体控件模拟ToolTip的实现【附带实例源码】
- Silverlight实用窍门系列:13.基于Popup浮动窗体控件模拟ToolTip的实现【附带实例源码】
- Silverlight实用窍门系列:23.Silverlight多线程技术Thread的应用,后台线程更新UI控件,向多线程传递参数【附带源码实例】
- Silverlight实用窍门系列:24.Silverlight多线程技术BackgroundWorker的应用,更新ProgressBar控件【附带源码实例】
- Silverlight实用窍门系列:50.InkPresenter涂鸦板的基本使用,以及将效果保存为Png图片【附带源码实例】
- Silverlight实用窍门系列:50.InkPresenter涂鸦板的基本使用,以及将效果保存为Png图片【附带源码实例】
- Silverlight实用窍门系列:26.Silverlight多线程技术ThreadPool的使用【附带源码实例】
- Silverlight实用窍门系列:56.Silverlight中的Binding使用(一)【附带实例源码】
- Silverlight实用窍门系列:56.Silverlight中的Binding使用(一)【附带实例源码】
- Silverlight实用窍门系列:17.中心点联动多线的可拖动控件(绘制工程图、拓扑图基础)【附带源码实例】
- Silverlight实用窍门系列:1.Silverlight读取外部XML加载配置---(使用WebClient读取XAP包同目录下的XML文件))【附带实例源码】
- Silverlight实用窍门系列:42.读取拖动到控件上的外部txt和jpg文件,多外部文件的拖动【附带实例源码】
- Silverlight实用窍门系列:35.细解Silverlight冒泡路由事件和注册冒泡路由事件【附带实例源码】
- Silverlight实用窍门系列:51.Silverlight页面控件的放大缩小、Silverlight和Html控件的互相操作【附带源码实例】