您的当前位置：首页>全部文章>文章详情

【C#】C# Winfrom Chart 图表控件 柱状图、折线图

CrazyPanda发表于：2024-02-02 23:11:48浏览：411次TAG：

目录

一、参考

二、柱状图

1.新建项目

2.修改图表样式

3.绑定数据

4.删除Series1图例

1）使用属性窗体删除

2）使用代码删除

5.自定义X轴的刻度值

1）使用List绑定

2）使用LabelStyle.Format绑定

6.自定义Y轴的刻度值

7.X轴刻度值显示不全的解决方法

8.修改X Y刻度值的字体样式

9.X轴刻度值旋转90°

10.禁用Y轴刻度线

11.去掉Y轴刻度值

12.改变柱子的宽度

13.设置网格线的颜色

14.设置网格线的线型

三、折线图

1.图表设置

2.绑定数据

结束



效果：

1.png


1.png


一、参考

c# Chart设置样式 - wenglabs - 博客园

强大的Winform Chart图表控件使用说明 - 走看看



二、柱状图

1.新建项目

新建一个.NET Framework 类型的 Winfrom 项目，在数据里面找到 Chart 控件，拖入到界面中

1.png

如下：

1.png

拖入控件时，默认的有一个图表的样式，实际运行其实是一片空白

1.png



2.修改图表样式

在Series这里，点击集合后面到三个点

1.png

这里可以修改图表的样式，比如柱状图，折线图

1.png


3.绑定数据

此时图表还没有任何数据，可以用绑定方式添加数据，如下

private List<int> XList = new List<int>();
private List<int> YList = new List<int>();
private Random randoms = new Random();
 
private void Form1_Load(object sender, EventArgs e)
{
    for (int i = 0; i < 6; i++)
    {
        XList.Add(i);
        YList.Add(randoms.Next(10, 100));
    }
    chart1.Series["Series1"].Points.DataBindXY(XList, YList);
}

 运行后如下

1.png

 上图有两个问题，

1.柱状图没有显示具体数据，根本看不出来实际数据是多少，

2.背景的网格没有去掉，样式比较难看，

用代码可以解决这两个问题

private List<int> XList = new List<int>();
private List<int> YList = new List<int>();
private Random randoms = new Random();
//private int index = -1;
 
private void Form1_Load(object sender, EventArgs e)
{
    chart1.ChartAreas[0].AxisX.MajorGrid.LineDashStyle = ChartDashStyle.NotSet; //设置网格类型为虚线
    chart1.ChartAreas[0].AxisY.MajorGrid.LineDashStyle = ChartDashStyle.Dash; //设置网格类型为虚线
    chart1.Series[0].IsValueShownAsLabel = true;//设置显示示数
 
    for (int i = 0; i < 6; i++)
    {
        XList.Add(i);
        YList.Add(randoms.Next(10, 100));
    }
    //写法同上面到 chart1.ChartAreas[0] 类似
    chart1.Series["Series1"].Points.DataBindXY(XList, YList);
}

效果

1.png

此时和我们想要的效果就差不多了


4.删除Series1图例

在图表的右上角有一个方块状的标记，然而我觉得它并没有什么作用，删除的方法有两种

1）使用属性窗体删除

1.png

在属性里选择Legends

1.png

选中Legend1，点击移除即可。

1.png

效果

1.png

2）使用代码删除

用代码删除的方式如下

chart1.Legends[0].Enabled = false;//取消图例

效果一样


5.自定义X轴的刻度值

1）使用List<string>绑定

在上面的案例中，我们可以看到，x轴显示的都是1，2，3.....按顺序排列的，如果我们想自定义刻度值，要怎么做呢，其实也很简单，绑定一个string类型的值就行了

代码：

using System;
using System.Collections.Generic;
using System.Windows.Forms;
using System.Windows.Forms.DataVisualization.Charting;
 
namespace 统计图
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }
 
        private List<string> XList = new List<string>();
        private List<int> YList = new List<int>();
        private Random randoms = new Random();
 
        private void Form1_Load(object sender, EventArgs e)
        {
            chart1.ChartAreas[0].AxisX.MajorGrid.LineDashStyle = ChartDashStyle.NotSet; //设置网格类型为虚线
            chart1.ChartAreas[0].AxisY.MajorGrid.LineDashStyle = ChartDashStyle.Dash; //设置网格类型为虚线
            chart1.Series[0].IsValueShownAsLabel = true;//设置显示示数
 
            for (int i = 0; i < 5; i++)
            {
                YList.Add(randoms.Next(10, 100));
                XList.Add(string.Format("第{0}号", i + 1));
            }
            chart1.Series["Series1"].Points.DataBindXY(XList, YList);
        }
 
    }
}

效果：

1.png

除此之外，还有另一种方法，那就是使用 LabelStyle.Format 进行自定义


2）使用LabelStyle.Format绑定

先绘制一个如下图所示的图表（在上面的案例中有代码）

1.png

此时想将这些数字改为其他值，只需要加上一句代码

chart1.ChartAreas[0].Axes[0].LabelStyle.Format = "#年"; //设置X轴显示样式

这里的 Axes[0] 效果同 AxesX 一样

 chart1.ChartAreas[0].AxisX.LabelStyle.Format = "#年"; //设置X轴显示样式

完整代码：

using System;
using System.Collections.Generic;
using System.Windows.Forms;
 
namespace 柱状图
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }
 
        private List<int> XList = new List<int>();
        private List<int> YList = new List<int>();
        private Random randoms = new Random();
 
        private void Form1_Load(object sender, EventArgs e)
        {
            chart1.ChartAreas[0].Axes[0].LabelStyle.Format = "#年"; //设置X轴显示样式
 
            for (int i = 0; i < 6; i++)
            {
                XList.Add(i);
                YList.Add(randoms.Next(10, 100));
            }
            chart1.Series["Series1"].Points.DataBindXY(XList, YList);
        }
 
    }
}

效果：

1.png


6.自定义Y轴的刻度值

操作和上节中的操作 LabelStyle.Format 一样

代码：

chart1.ChartAreas[0].AxisY.LabelStyle.Format = "#年";

效果：

1.png


7.X轴刻度值显示不全的解决方法

当X轴刻度值过于密集的时候，就会出现有部分显示不出来，如图

1.png

打开图表的 ChartAreas 集合

1.png

1.png

将间隔中的Interval 设置为1

1.png

效果：

1.png

8.修改X Y刻度值的字体样式

1.png

1.png

1.png

在成员这里可以选择要修改X，或者Y轴的值，对应的 axis属性里 LabelStyle 里面就有非常多详细的属性了


9.X轴刻度值旋转90°

根据上节操作打开 X axis 中的 LabelStyle，将 Angle 设置为90

1.png

效果

1.png 

完整代码

using System;
using System.Collections.Generic;
using System.Windows.Forms;
 
namespace 柱状图
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }
 
        private List<string> XList = new List<string>();
        private List<int> YList = new List<int>();
        private Random randoms = new Random();
 
        private void Form1_Load(object sender, EventArgs e)
        {
            chart1.ChartAreas[0].AxisX.MajorGrid.LineDashStyle = System.Windows.Forms.DataVisualization.Charting.ChartDashStyle.NotSet;//设置网格线型为不显示
            chart1.ChartAreas[0].AxisY.MajorGrid.LineDashStyle = System.Windows.Forms.DataVisualization.Charting.ChartDashStyle.Dash;//设置网格线型为虚线
            chart1.ChartAreas[0].AxisY.MajorGrid.LineColor = System.Drawing.Color.LightGray;//网格线的颜色
            chart1.Series[0].IsValueShownAsLabel = true;//设置显示示数
 
            for (int i = 0; i < 20; i++)
            {
                YList.Add(randoms.Next(10, 100));
                XList.Add(string.Format("第{0}号", i + 1));
            }
            chart1.Series["Series1"].Points.DataBindXY(XList, YList);
        }
    }
}


10.禁用Y轴刻度线

Y轴的边框有时候感觉真的有点丑，其实也是可以去掉的

1.png

 按照上面步骤8打开 Axis 集合编辑器，选择 Y(Value) axis，将 Enabled 设置为 false 即可。

1.png

效果：

1.png


11.去掉Y轴刻度值

按照上节的步骤禁用了整个Y轴后，发现Y轴的刻度线没了，背景的虚线也没了，如果你还是需要这些样式的话，还是有办法的，就是将刻度值颜色设置成背景颜色一致，那么就看不到了

//chart1.ChartAreas[0].AxisY.LineColor = System.Drawing.Color.White;//Y轴线白色
chart1.ChartAreas[0].AxisY.LabelStyle.ForeColor = System.Drawing.Color.White;//刻度值颜色
chart1.ChartAreas[0].AxisY.MajorTickMark.Enabled = false;//隐藏刻度线

效果：

1.png

左边这里有点空白，可以将整个图表控件的坐标向左边移动一点。


12.改变柱子的宽度

柱子的宽度是根据柱子的数量和控件的宽度决定的，如果柱子宽度过大要怎么解决呢

1.png

加入代码：

chart1.Series[0]["PointWidth"] = "0.5";//宽度chart1.ChartAreas[0].AxisX.IsMarginVisible = true;//表格开始和末尾添加一个空格

 效果：

1.png


13.设置网格线的颜色

在上节中的图表可以看到灰色的虚线，看起来还行，代码如下

chart1.ChartAreas[0].AxisY.MajorGrid.LineColor = System.Drawing.Color.LightGray;//网格线的颜色


14.设置网格线的线型

代码如下

//设置网格线型为不显示
chart1.ChartAreas[0].AxisX.MajorGrid.LineDashStyle = System.Windows.Forms.DataVisualization.Charting.ChartDashStyle.NotSet; 
//设置网格线型为虚线
chart1.ChartAreas[0].AxisY.MajorGrid.LineDashStyle = System.Windows.Forms.DataVisualization.Charting.ChartDashStyle.Dash;

线型官方枚举的定义

    //
    // 摘要:
    //     指定线型。
    public enum ChartDashStyle
    {
        //
        // 摘要:
        //     不设置线型。
        NotSet = 0,
        //
        // 摘要:
        //     虚线。
        Dash = 1,
        //
        // 摘要:
        //     由重复的点划线图案构成的直线。
        DashDot = 2,
        //
        // 摘要:
        //     由重复的双点划线图案构成的直线。
        DashDotDot = 3,
        //
        // 摘要:
        //     由重复的点图案构成的直线。
        Dot = 4,
        //
        // 摘要:
        //     实线。
        Solid = 5
    }



三、折线图

1.图表设置

新建一个.NET Framework 类型的 Winfrom 项目，操作同上面一致，将 ChartType 这里设置成 Line，并且在Form1界面中添加一个按钮

1.png

1.png

运行以后，图表依然是一片空白

1.png


2.绑定数据

添加代码

using System;
using System.Collections.Generic;
using System.Windows.Forms;
using System.Windows.Forms.DataVisualization.Charting;
 
namespace 折线图
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }
 
        private List<int> XList = new List<int>();
        private List<int> YList = new List<int>();
        private Random randoms = new Random();
        private int index = -1;
 
        private void Form1_Load(object sender, EventArgs e)
        {
            chart1.ChartAreas[0].AxisX.MajorGrid.LineDashStyle = ChartDashStyle.NotSet; //设置网格类型为虚线
            chart1.ChartAreas[0].AxisY.MajorGrid.LineDashStyle = ChartDashStyle.Dash; //设置网格类型为虚线
            chart1.Series[0].IsValueShownAsLabel = true;//设置显示示数
        }
 
        private void button1_Click(object sender, EventArgs e)
        {
            index++;
            XList.Add(index);
            YList.Add(randoms.Next(10, 100));
            //chart1.Series[0].Points.AddXY(index, randoms.Next(10, 100));
            chart1.Series[0].Points.DataBindXY(XList, YList);
        }
    }
}

 运行后，点击添加按钮，效果如下：

1.png

这里你会发现一个问题，图中到93这个点，已经跑到顶部了，字都被挡了一半 ，这里可以用代码设置，比如，遍历整个Y轴的值，然后计算出最大值和最小值，并给chart1的Maximum，Minimum赋值，就可以让折线图居中了

chart1.ChartAreas[0].AxisY.Maximum = 200;

如果你想要下面的效果，也可以参考我的帖子，有需要的可以支持一下我了，谢谢。

C# System.Windows.Forms.DataVisualization Demo案例_熊思宇的博客-CSDN博客_c# system.windows.forms

01174706_63da351a96fff24847.gif

源码下载：点击下载


结束

如果这个帖子对你有用，欢迎 关注 + 点赞 + 留言，谢谢

end


原文链接C# Winfrom Chart 图表控件 柱状图、折线图_c# 图表-CSDN博客

上一篇：【C#】C# Winfrom 右键菜单

猜你喜欢

【C#】C#二分查找（迭代与递归）
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;二分搜索被定义为一种在排序数组中使用的搜索算法，通过重复将搜索间隔一分为二。二分查找的思想是利用数组已排序的信息，将时间复杂度降低到O(log N)。二分查找算法示例&nbsp;何时在数据结构中应用二分查找的条件： 应用二分查找算法： &nbsp; &nbsp; &nbsp; &nbsp; 1、数据结构必须是有序的。 &nbsp; &nbsp; &nbsp; &nbsp; 2、访问数据结构的任何元素都
发表于：2024-03-11 浏览：307 TAG：
【C#】C# Winfrom 常用功能整合-2
目录Winfrom&nbsp;启动一个外部exe文件，并传入参数Winform ListBox用法HTTP下载文件(推荐）Winform HTTP下载并显示进度Winform&nbsp;HTTP下载文件Winform&nbsp;跨线程访问UI组件Winform 改变文字的颜色和大小Winfrom&nbsp;启动一个外部exe文件，并传入参数在我们常用的一些软件中，经常有些软件，双击之后根本打不开，这是因为启动时做了限制，我们需要传入一些参数才能打开，在工作中，这个需求也可以用在软件的自动更新上，
发表于：2024-02-02 浏览：332 TAG：
【C#】C#md5加密
using&nbsp;System; using&nbsp;System.Collections.Generic; using&nbsp;System.Linq; using&nbsp;System.Security.Cryptography; using&nbsp;System.Text; using&nbsp;System.Threading.Tasks; &nbsp; namespace&nbsp;mdstr { &nbsp;&nbsp;&nbsp;&nbsp;internal&nbsp;
发表于：2024-01-30 浏览：267 TAG：
【C#】Winform NanUI 相关功能整合
目录NanUI 0.88版本 去掉启动界面（遮罩）NanUI 0.88版本 读取本地资源和嵌入式资源NanUI 0.77版本 打开控制台NanUI 0.77版本 C#调用多个参数的JS方法NanUI 0.77版本 传递数组参数NanUI 0.77版本 设置窗体全屏显示（类似Kiosk模式）NanUI 0.77版本 Bootstrap类 APINanUI 0.88版本 去掉启动界面（遮罩）启动界面是作者给我们显示公司产品的Logo用的，如果用不着可以去掉，但必须要更改源码，如果不想改源码，直接将启
发表于：2024-02-09 浏览：371 TAG：
【C#】C# 解压zip文件，并覆盖
&nbsp;使用ZipFile.ExtractToFile方法，并将overwrite参数设置为true，这样可以覆盖同名的目标文件。代码如下：using&nbsp;System; using&nbsp;System.IO; using&nbsp;System.IO.Compression; &nbsp; namespace&nbsp;ConsoleApplication { &nbsp;&nbsp;&nbsp;&nbsp;class&nbsp;Program &nbsp;&nbsp;&amp;nbs
发表于：2024-01-29 浏览：580 TAG：
【C#】C# Winform DataGridView 数据刷新问题
目录一、问题二、创建项目三、绑定空的数据源四、绑定有数据的数据源五、修改绑定的数据源六、解决数据源刷新问题七、解决刷新数据界面闪烁一、问题DataGridView 是比较常用的表格控件，在 DataGridView 中显示数据，&nbsp;一般使用 dataGridView1.DataSource = 数据源，来绑定数据，数据源可以是 DataTable、List、Dictionary 等，那么如何做到及时刷新数据呢，这里我提出几个问题：1.绑定一个空的数据源，后面向数据源添加数据。2.Data
发表于：2024-02-05 浏览：345 TAG：
【C#】C#调用win10系统自带软键盘的方法
上次做了个笔记是关于调用windows系统自带的触摸键盘的方法：C#调用Windows系统自带触摸键盘的方法_c# 虚拟键盘-CSDN博客除了调用触摸键盘，我们也可以通过调用win10的自带软键盘作为输入途径。方法很简单。1、添加using System.Diagnostics引用。2、创建进程Process Winvirkey = Process.Start(&quot;osk.exe&quot;);3、打开键盘：Winvirkey = Process.Start(&quot;osk.exe&amp;
发表于：2024-01-29 浏览：357 TAG：
【C#】c#Windows桌面程序退入托盘及右键菜单
一. 退出托盘功能窗体加组件notifyIcon修改属性，属性中加入要在托盘显示时呈现的图标。添加MouseClick事件编辑代码：private&nbsp;void&nbsp;Form_Main_FormClosing(object&nbsp;sender,&nbsp;FormClosingEventArgs&nbsp;e) { &nbsp;&nbsp;&nbsp;&nbsp;e.Cancel&nbsp;=&nbsp;true; &nbsp;&nbsp;&nbsp;&nbsp;this.Hid
发表于：2024-01-28 浏览：391 TAG：
【C#】Winform NanUI 0.77版本 读取本地资源（扩展功能）
一、前言在NanUI官方的文档中，原本是有一个NanUI.FileResourceHandler的扩展包的，但现在官方已经无法下载了，现在只有0.88版本中有一个NanUI.LocalFileResource程序包，而0.77版本只剩下了一个读取嵌入式资源的程序包。关于NanUI：NanUI | .Net/.Net Core界面组件NanUI 0.7版正式发布 - 林选臣 - 博客园在扩展功能之前，请参考[资源处理器]-04 自定义资源处理器 - 知乎&nbsp;，我参考这个帖子进行扩展的，也不
发表于：2024-02-08 浏览：326 TAG：
【C#】C# System.Windows.Forms.DataVisualization Demo案例
简介DataVisualization 其实就是Winform 中自带的 Chart 控件，整个图形控件主要由以下几个部份组成：1.Annotations --图形注解集合2.ChartAreas&nbsp; --图表区域集合3.Legends&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; --图例集合4.Series　　&nbsp; --图表序列集合（即图表数据对象集合）5.Titles　　　--图标的标题集合每个集合具体介绍，可以参考下面的帖子，看完了介绍，一定对你理解这个插件
发表于：2024-02-01 浏览：286 TAG：
栏目分类全部>
标签云
#服务器 #localstorage #clipboard #base64 #图像 #测试 #渐变色 #支付宝 #TIOBE #cropper #acme #C# #mongodb #rpc #框架 #composer #swoole #api #php #CSS
推荐文章
© 2023~2025 疯狂的熊猫 豫ICP备19023836号-4