文档章节

Visifire图表控件对有大差异数据的图标绘制问题

咲晚杍
 咲晚杍
发布于 2013/08/15 13:56
字数 1044
阅读 470
收藏 1

好的图表不仅能够起到美化布局的作用,而且对于数据的展示也会更加的形象直观,但是有时候也会出现这种情况,比如说数据的差异比较大的情况,在这种情况下呢,有的非常小的数据可能在图表中就不能够展示出来。

最近刚好在看Visifire的图表,发现里面的文字标注栏的Legend点击事件就可以有效的避免这个问题。

下面就以在日常生活中比较常见的电脑网络发包量为例来进行说明,这是我在网上看见的一个例子:

例如在统计一组用户电脑的网络发包量的时候,有一些用户开启电脑几十个小时,有一些用户开启电脑几秒钟。很明显用户开机几十个小时的发包量巨大,而开机几秒钟的发包量极小,如果放在一个Visifire的图标中组成一个统计列的时候,发包量小的电脑几乎看不见了。这种情况下,我们就可以通过点击文字标注栏的Legend文字来确定某一个在图表上看不见的用户电脑的发包量。

第一步:设置一个实体类,该类包含(ComputerName,NetWorkNum)两个属性,分别代码电脑名和电脑网络发包量:

/// <summary>
    /// 电脑信息
    /// </summary>
    publicclass ComputerInfomation
    {
        string_ComputerName;
        string_NetWorkNum;
        /// <summary>
        /// 电脑名称
        /// </summary>
        publicstringComputerName
        {
            get{return_ComputerName; }
            set{ _ComputerName = value; }
        }
        /// <summary>
        /// 网络发送包
        /// </summary>
        publicstringNetWorkNum
        {
            get{return_NetWorkNum; }
            set{ _NetWorkNum = value; }
        }
    }
第二步:实例化该类形成多个实体类对象集合,MainPage.xaml.cs的构造函数中敲入代码如下:
ComputerList =newList<ComputerInfomation>()
            {
            newComputerInfomation(){ComputerName="张三的电脑", NetWorkNum="32143242223"},
            newComputerInfomation(){ComputerName="李四的电脑", NetWorkNum="23432423"},
            newComputerInfomation(){ComputerName="王五的电脑", NetWorkNum="12342342344"},
            newComputerInfomation(){ComputerName="刘六的电脑", NetWorkNum="562342"},
            newComputerInfomation(){ComputerName="林七的电脑", NetWorkNum="55353453445"},
            newComputerInfomation(){ComputerName="马林的电脑", NetWorkNum="2454555543"}
            };
            BindChart(ComputerList);
第三步:制作一个函数,此函数创建一个图表并且设置相应的Legend文字标注栏的事件绑定
List<ComputerInfomation> ComputerList =newList<ComputerInfomation>();
        /// <summary>
        /// 绑定一个图标
        /// </summary>
        /// <param name="computerList">用户电脑类实体集合</param>
        publicvoidBindChart( List<ComputerInfomation> computerList)
        {
            Chart chart =newChart();
            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 =newSolidColorBrush(Colors.Gray);
            chart.AnimatedUpdate =true;
            chart.CornerRadius =newCornerRadius(7);
            chart.ShadowEnabled =true;
            chart.Padding =newThickness(4, 4, 4, 10);
 
            #region 设置Title
            Title title =newTitle();
            title.Text ="电脑网络发包统计";
            chart.Titles.Add(title);
            #endregion
 
            #region 设置AxesX
            Axis xAxis =newAxis();
            xAxis.Title ="用户电脑";
            chart.AxesX.Add(xAxis);
            #endregion
 
            #region 设置AxesY
            Axis yAxis =newAxis();
            yAxis.Title ="用户网卡发送包";
            yAxis.Prefix ="发送:";
            yAxis.Suffix ="包";
            chart.AxesY.Add(yAxis);
            #endregion
 
            #region 设置PlotArea
            PlotArea plot =newPlotArea();
            plot.ShadowEnabled =false;
            chart.PlotArea = plot;
            #endregion
 
            #region 设置Legends
            Legend legend =newLegend();
            //Legend文字标注栏绑定一个事件Legend_MouseLeftButtonDown
            legend.MouseLeftButtonDown +=newEventHandler<LegendMouseButtonEventArgs>(Legend_MouseLeftButtonDown);
            chart.Legends.Add(legend);
            #endregion
            #region
            Visifire.Charts.ToolTip tip =newVisifire.Charts.ToolTip();
            tip.VerticalAlignment = VerticalAlignment.Bottom;
            chart.ToolTips.Add(tip);
            #endregion
            #region 创建数据序列和数据点
            foreach(ComputerInfomation cominfoincomputerList)
            {
                DataSeries dseries =newDataSeries();
                //设置一个数据序列的LengendText值为ComputerName
                dseries.LegendText = cominfo.ComputerName;
                //设置图表的类型为RenderAs.StackedColumn
                dseries.RenderAs = RenderAs.StackedColumn;
                //设置一个数据点
                DataPoint dpointUpload =newDataPoint();
                //数据点的Y坐标值
                dpointUpload.YValue =double.Parse(cominfo.NetWorkNum);
                //数据点的Tag值也为电脑名称,用于数据点被点击后对比判断当前点击的点
                dpointUpload.Tag = cominfo.ComputerName;
                //设置数据点被点击之后触发事件Dpoint_MouseLeftButtonDown
                dpointUpload.MouseLeftButtonDown +=newMouseButtonEventHandler(Dpoint_MouseLeftButtonDown);
                dseries.DataPoints.Add(dpointUpload);
                chart.Series.Add(dseries);
            }
            #endregion
            #region 设置遮罩,将Visifire的LOGO遮挡住。
            StackPanel sp =newStackPanel();
            sp.Width = 145;
            sp.Height = 15;
            sp.Margin =newThickness(0, 3, 3, 0);
            sp.VerticalAlignment = VerticalAlignment.Top;
            sp.HorizontalAlignment = HorizontalAlignment.Right;
            sp.Background =newSolidColorBrush(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>
        voidDpoint_MouseLeftButtonDown(objectsender, MouseButtonEventArgs e)
        {
            //接收到当前被点击的LengendText的值
            DataPoint dpoint = senderasDataPoint;
            stringstr = dpoint.Tag.ToString();
            foreach(ComputerInfomation cominfoinComputerList)
            {
                if(str == cominfo.ComputerName)
                {
                    MessageBox.Show(cominfo.ComputerName +"网络发送:"+ cominfo.NetWorkNum +"数据包");
                }
            }
        }
        /// <summary>
        /// Legend文字被点击执行的事件
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        privatevoidLegend_MouseLeftButtonDown(objectsender, LegendMouseButtonEventArgs e)
        {
            //接收到当前被点击的LengendText的值
            stringstr = e.DataSeries.LegendText.ToString();
            foreach(ComputerInfomation cominfoinComputerList)
            {
                if(str == cominfo.ComputerName)
                {
                    MessageBox.Show(cominfo.ComputerName +"网络发送:"+ cominfo.NetWorkNum +"数据包");
                }
            }
        }
 
通过以上的方法就很好的解决了数据差异的问题,效果图如下所示: 
 
 

本文转载自:http://www.evget.com/zh-CN/Info/catalog/17873.html

咲晚杍
粉丝 7
博文 75
码字总数 8143
作品 0
渝中
私信 提问
从数据库获取图表数据的 .Net图表控件MasterChart

MasterChart 是一个简单实用的 .Net图表控件,可使用于绘制各种不同类型的图表 -bars, cylinders, pies, doughnuts, lines, areas, scatter, bubble, radar, polar等,该控件可同时用于Windo...

yidongkaifa
2014/06/20
62
0
visifire使用心得

visifire是silverlight下很不错的一套开源组件,最近其 发布了2.0beta版本,本文将主要记录一些这个版本跟以前版本不 同的地方. 昨天初步把1.55版本移植到了2.0beta,没有遇到太大的麻烦,不过确...

红薯
2008/12/27
2.2K
0
Visifire 使用笔记

visifire是silverlight下很不错的一套开源组件,最近其发布了2.0beta版本,本文将主要记录一些这个版 本跟以前版本不同的地方. 昨天初步把1.55版本移植到了2.0beta,没有遇到太大的麻烦,不过确实...

红薯
2008/12/27
1K
2
关于WPF Visifire的Chart组件的问题

不知道有没有用过Visifire的大神,最近需要做图表,刚接触Visifire,感觉真心好用,但是数据多了之后,滚动条就出现了,如何让滚动条自动滚到最后(最右),如图下方横向的滚动条,如果不知道...

归邪
2015/07/26
437
0
在Silverlight下用Visifire显示多维数据集中的数据

本文使用Silverlight 2,visifire版本是2.0.4 beta。多维数据集的SQLServer版本是2008,示例中使用的多维数据集是微软示例多维数据集Adventure Works DW 2008,对于复杂的多维数据集查询asp...

红薯
2008/12/27
2.1K
1

没有更多内容

加载失败,请刷新页面

加载更多

SSH安全加强两步走

从 OpenSSH 6.2 开始已经支持 SSH 多因素认证,本文就来讲讲如何在 OpenSSH 下启用该特性。 OpenSSH 6.2 以后的版本多了一个配置项 AuthenticationMethods。该配置项可以让 OpenSSH 同时指定...

xiangyunyan
42分钟前
5
0
C或C++不是C/C++

http://www.voidcn.com/article/p-mucdruqa-ws.html

shzwork
今天
6
0
OSChina 周六乱弹 —— 如何将梳子卖给和尚

Osc乱弹歌单(2019)请戳(这里) 【今日歌曲】 @for_ :划水五分钟,专注两小时。分享Various Artists的单曲《贝多芬第8号钢琴奏鸣曲悲伤的第三乐章》: 《贝多芬第8号钢琴奏鸣曲悲伤的第三乐...

小小编辑
今天
310
8
ES5

什么是ES5:比普通js运行要求更加严格的模式 为什么:js语言本身有很多广受诟病的缺陷 如何:在当前作用域的顶部添加:"use strict" 要求: 1、禁止给未声明的变量赋值 2、静默失败升级为错误...

wytao1995
今天
7
0
c++ 内联函数调用快的原因

见图片分析

天王盖地虎626
今天
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部