Silverlight实用窍门系列:15.Visifire图表控件的使用二(DataPoint点击事件和Legend文字标注栏的点击事件)【附带源码实例】...

        图表应用于表现数据量,进行直观的对比,但是在某一些领域中如果数据之间大小差异过大,那么会出现某一些数据因为过小,而无法让用户看见的情况。例如在统计一组用户电脑的网络发包量的时候,有一些用户开启电脑几十个小时,有一些用户开启电脑几秒钟。很明显用户开机几十个小时的发包量巨大,而开机几秒钟的发包量极小,如果放在一个Visifire的图标中组成一个统计列的时候,发包量小的电脑几乎看不见了。这种情况下,我们就可以通过点击文字标注栏的Legend文字来确定某一个在图表上看不见的用户电脑的发包量。

        首先我们设置一个实体类,该类包含(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 下载源码。运行效果如下:

2011022816443424.jpg

转载于:https://www.cnblogs.com/chengxingliang/archive/2011/02/28/1967127.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值