zoukankan      html  css  js  c++  java
  • 强大的Winform Chart图表控件使用说明

    使用说明

    在工具箱-数据分组中我们就可以看到chart控件,使用时拖拽到界面即可。可以通过属性面板设置其样式,也可以通过代码来调整样式。设置的属性可参照:https://www.cnblogs.com/arxive/p/5861960.html

    下面展示下自己做技术测试的图片:
    winform chart使用样例

    总结了部分设置chart样式功能的通用类:

    public class ChartHelper
        {
            /// <summary>
            /// Name:添加序列
            /// Author:by boxuming 2019-04-28 13:59
            /// </summary>
            /// <param name="chart">图表对象</param>
            /// <param name="seriesName">序列名称</param>
            /// <param name="chartType">图表类型</param>
            /// <param name="color">颜色</param>
            /// <param name="markColor">标记点颜色</param>
            /// <param name="showValue">是否显示数值</param>
            public static void AddSeries(Chart chart, string seriesName, SeriesChartType chartType, Color color, Color markColor, bool showValue = false)
            {
                chart.Series.Add(seriesName);
                chart.Series[seriesName].ChartType = chartType;
                chart.Series[seriesName].Color = color;
                if (showValue)
                {
                    chart.Series[seriesName].IsValueShownAsLabel = true;
                    chart.Series[seriesName].MarkerStyle = MarkerStyle.Circle;
                    chart.Series[seriesName].MarkerColor = markColor;
                    chart.Series[seriesName].LabelForeColor = color;
                    chart.Series[seriesName].LabelAngle = -90;
                }
            }
    
            /// <summary>
            /// Name:设置标题
            /// Author:by boxuming 2019-04-28 14:25
            /// </summary>
            /// <param name="chart">图表对象</param>
            /// <param name="chartName">图表名称</param>
            public static void SetTitle(Chart chart, string chartName, Font font, Docking docking, Color foreColor)
            {
                chart.Titles.Add(chartName);
                chart.Titles[0].Font = font;
                chart.Titles[0].Docking = docking;
                chart.Titles[0].ForeColor = foreColor;
            }
    
            /// <summary>
            /// Name:设置样式
            /// Author:by boxuming 2019-04-23 14:04
            /// </summary>
            /// <param name="chart">图表对象</param>
            /// <param name="backColor">背景颜色</param>
            /// <param name="foreColor">字体颜色</param>
            public static void SetStyle(Chart chart, Color backColor, Color foreColor)
            {
                chart.BackColor = backColor;
                chart.ChartAreas[0].BackColor = backColor;
                chart.ForeColor = Color.Red;
            }
    
            /// <summary>
            /// Name:设置图例
            /// Author:by boxuming 2019-04-23 14:30
            /// </summary>
            /// <param name="chart">图表对象</param>
            /// <param name="docking">停靠位置</param>
            /// <param name="align">对齐方式</param>
            /// <param name="backColor">背景颜色</param>
            /// <param name="foreColor">字体颜色</param>
            public static void SetLegend(Chart chart, Docking docking, StringAlignment align, Color backColor, Color foreColor)
            {
                chart.Legends[0].Docking = docking;
                chart.Legends[0].Alignment = align;
                chart.Legends[0].BackColor = backColor;
                chart.Legends[0].ForeColor = foreColor;
            }
    
            /// <summary>
            /// Name:设置XY轴
            /// Author:by boxuming 2019-04-23 14:35
            /// </summary>
            /// <param name="chart">图表对象</param>
            /// <param name="xTitle">X轴标题</param>
            /// <param name="yTitle">Y轴标题</param>
            /// <param name="align">坐标轴标题对齐方式</param>
            /// <param name="foreColor">坐标轴字体颜色</param>
            /// <param name="lineColor">坐标轴颜色</param>
            /// <param name="arrowStyle">坐标轴箭头样式</param>
            /// <param name="xInterval">X轴的间距</param>
            /// <param name="yInterval">Y轴的间距</param>
            public static void SetXY(Chart chart, string xTitle, string yTitle, StringAlignment align, Color foreColor, Color lineColor, AxisArrowStyle arrowStyle, double xInterval, double yInterval)
            {
                chart.ChartAreas[0].AxisX.Title = xTitle;
                chart.ChartAreas[0].AxisY.Title = yTitle;
                chart.ChartAreas[0].AxisX.TitleAlignment = align;
                chart.ChartAreas[0].AxisY.TitleAlignment = align;
                chart.ChartAreas[0].AxisX.TitleForeColor = foreColor;
                chart.ChartAreas[0].AxisY.TitleForeColor = foreColor;
                chart.ChartAreas[0].AxisX.LabelStyle = new LabelStyle() { ForeColor = foreColor };
                chart.ChartAreas[0].AxisY.LabelStyle = new LabelStyle() { ForeColor = foreColor };
                chart.ChartAreas[0].AxisX.LineColor = lineColor;
                chart.ChartAreas[0].AxisY.LineColor = lineColor;
                chart.ChartAreas[0].AxisX.ArrowStyle = arrowStyle;
                chart.ChartAreas[0].AxisY.ArrowStyle = arrowStyle;
                chart.ChartAreas[0].AxisX.Interval = xInterval;
                chart.ChartAreas[0].AxisY.Interval = yInterval;
            }
    
            /// <summary>
            /// Name:设置网格
            /// Author:by boxuming 2019-04-23 14:55
            /// </summary>
            /// <param name="chart">图表对象</param>
            /// <param name="lineColor">网格线颜色</param>
            /// <param name="xInterval">X轴网格的间距</param>
            /// <param name="yInterval">Y轴网格的间距</param>
            public static void SetMajorGrid(Chart chart, Color lineColor, double xInterval, double yInterval)
            {
                chart.ChartAreas[0].AxisX.MajorGrid.LineColor = lineColor;
                chart.ChartAreas[0].AxisY.MajorGrid.LineColor = lineColor;
                chart.ChartAreas[0].AxisX.MajorGrid.Interval = xInterval;
                chart.ChartAreas[0].AxisY.MajorGrid.Interval = yInterval;
            }
        }
    

      

    使用示例(开头四个图表)

    chart1.Series.Clear();
                ChartHelper.AddSeries(chart1, "柱状图", SeriesChartType.Column, Color.Lime, Color.Red, true);
                ChartHelper.AddSeries(chart1, "曲线图", SeriesChartType.Spline, Color.Red, Color.Red);
                ChartHelper.SetTitle(chart1, "柱状图与曲线图", new Font("微软雅黑", 12), Docking.Bottom, Color.White);
                ChartHelper.SetStyle(chart1, Color.Transparent, Color.White);
                ChartHelper.SetLegend(chart1, Docking.Top, StringAlignment.Center, Color.Transparent, Color.White);
                ChartHelper.SetXY(chart1, "序号", "数值", StringAlignment.Far, Color.White, Color.White, AxisArrowStyle.SharpTriangle, 1, 2);
                ChartHelper.SetMajorGrid(chart1, Color.Gray, 20, 2);
    
                chart2.Series.Clear();
                ChartHelper.AddSeries(chart2, "饼状图", SeriesChartType.Pie, Color.Lime, Color.Red, true);
                ChartHelper.SetStyle(chart2, Color.Transparent, Color.White);
                ChartHelper.SetLegend(chart2, Docking.Top, StringAlignment.Center, Color.Transparent, Color.White);
    
                chart3.Series.Clear();
                ChartHelper.AddSeries(chart3, "曲线图", SeriesChartType.SplineRange, Color.FromArgb(100,46, 199, 201), Color.Red, true);
                ChartHelper.SetTitle(chart3, "曲线图", new Font("微软雅黑", 12), Docking.Bottom, Color.FromArgb(46, 199, 201));
                ChartHelper.SetStyle(chart3, Color.Transparent, Color.White);
                ChartHelper.SetLegend(chart3, Docking.Top, StringAlignment.Center, Color.Transparent, Color.White);
                ChartHelper.SetXY(chart3, "序号", "数值", StringAlignment.Far, Color.White, Color.White, AxisArrowStyle.SharpTriangle, 1, 2);
                ChartHelper.SetMajorGrid(chart3, Color.Gray, 20, 2);
    
                chart4.Series.Clear();
                ChartHelper.AddSeries(chart4, "饼状图", SeriesChartType.Funnel, Color.Lime, Color.Red, true);
                ChartHelper.SetStyle(chart4, Color.Transparent, Color.White);
                ChartHelper.SetLegend(chart4, Docking.Top, StringAlignment.Center, Color.Transparent, Color.White);
                
    			RefreshData();
    

    绑定数据部分代码如下:

    public void RefreshData()
            {
                List<int> x1 = new List<int>() { 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12 };
                List<int> y1 = new List<int>();
                Random ra = new Random();
                y1 = new List<int>() {
                    ra.Next(1, 10),
                    ra.Next(1, 10),
                    ra.Next(1, 10),
                    ra.Next(1, 10),
                    ra.Next(1, 10),
                    ra.Next(1, 10),
                    ra.Next(1, 10),
                    ra.Next(1, 10),
                    ra.Next(1, 10),
                    ra.Next(1, 10),
                    ra.Next(1, 10),
                    ra.Next(1, 10)
                };
                RefreshChart(x1, y1, "chart1");
                RefreshChart(x1, y1, "chart2");
                RefreshChart(x1, y1, "chart3");
                RefreshChart(x1, y1, "chart4");
            }
    
            public delegate void RefreshChartDelegate(List<int> x, List<int> y, string type);
            public void RefreshChart(List<int> x, List<int> y, string type)
            {
                if (type == "chart1")
                {
                    if (this.chart1.InvokeRequired)
                    {
                        RefreshChartDelegate stcb = new RefreshChartDelegate(RefreshChart);
                        this.Invoke(stcb, new object[] { x, y, type });
                    }
                    else
                    {
                        chart1.Series[0].Points.DataBindXY(x, y);
                        chart1.Series[1].Points.DataBindXY(x, y);
                    }
                }
                else if (type == "chart2")
                {
                    if (this.chart2.InvokeRequired)
                    {
                        RefreshChartDelegate stcb = new RefreshChartDelegate(RefreshChart);
                        this.Invoke(stcb, new object[] { x, y, type });
                    }
                    else
                    {
                        chart2.Series[0].Points.DataBindXY(x, y);
                        List<Color> colors = new List<Color>() {
                            Color.Red,
                            Color.DarkRed,
                            Color.IndianRed,
                            Color.MediumVioletRed,
                            Color.OrangeRed,
                            Color.PaleVioletRed,
                            Color.Purple,
                            Color.DarkOrange,
                            Color.Maroon,
                            Color.LightCoral,
                            Color.LightPink,
                            Color.Magenta
                        };
                        DataPointCollection points = chart2.Series[0].Points;
                        for (int i = 0; i < points.Count; i++)
                        {
                            points[i].Color = colors[i];
                        }
                    }
                }
                else if (type == "chart3")
                {
                    if (this.chart3.InvokeRequired)
                    {
                        RefreshChartDelegate stcb = new RefreshChartDelegate(RefreshChart);
                        this.Invoke(stcb, new object[] { x, y, type });
                    }
                    else
                    {
                        chart3.Series[0].Points.DataBindXY(x, y);
                    }
                }
                else if (type == "chart4")
                {
                    if (this.chart4.InvokeRequired)
                    {
                        RefreshChartDelegate stcb = new RefreshChartDelegate(RefreshChart);
                        this.Invoke(stcb, new object[] { x, y, type });
                    }
                    else
                    {
                        chart4.Series[0].Points.DataBindXY(x, y);
                        List<Color> colors = new List<Color>() {
                            Color.Red,
                            Color.DarkRed,
                            Color.IndianRed,
                            Color.MediumVioletRed,
                            Color.OrangeRed,
                            Color.PaleVioletRed,
                            Color.Purple,
                            Color.DarkOrange,
                            Color.Maroon,
                            Color.LightCoral,
                            Color.LightPink,
                            Color.Magenta
                        };
                        DataPointCollection points = chart4.Series[0].Points;
                        for (int i = 0; i < points.Count; i++)
                        {
                            points[i].Color = colors[i];
                        }
                    }
                }
            }
    

    为了让图表展现动画效果,添加了一个定时器,用来实时改变数据,这样就可以看到动起来的图表了。定时器代码如下:

    private void Timer1_Tick(object sender, EventArgs e)
            {
                new Thread(new ThreadStart(RefreshData)).Start();
            }
    

      

    资料
    以上只是使用chart控件的几个简单示例,而chart控件的功能远远不止这些。为了更方便地了解和使用其他功能,特提供了一些资料,其中包括图表的属性说明文档、各类图表的样式和对应的代码、以及程序示例等,下载地址如下:
    链接:https://pan.baidu.com/s/1mCxiwrEBxeCKkSltXMJPpA
    提取码:9pgr


    原文:https://blog.csdn.net/boxuming/article/details/89678159

    为API生,为框架死,为debug奋斗一辈子;吃符号亏,上大小写的当,最后死在需求上。
  • 相关阅读:
    [转载] 美团-云鹏: 写给工程师的十条精进原则
    Docker测试一个静态网站
    Docker容器访问外部世界
    Docker容器间通信
    Docker网络(host、bridge、none)详细介绍
    Docker的资源限制(内存、CPU、IO)详细篇
    esxi中CentOS7不停机加磁盘并扩容现有分区
    ESXI6.5安装CentOS7教程
    Linux查看占用CPU和内存的 的程序
    Centos7使用脚本搭建LVS的DR模式。
  • 原文地址:https://www.cnblogs.com/ChaunceyWan/p/11171896.html
Copyright © 2011-2022 走看看