C#创建基本图表(Chart Controls)

个人随记 同时被 2 个专栏收录
26 篇文章 0 订阅
6 篇文章 0 订阅

Chart表格控件是 .netframework4.0之后才有的。所以在开发中请保持你使用的是4.0及以上版本。

首先一个Chart控件里面 可以有多个 ChartArea 每一个ChartArea 里面可以有自己的横轴和纵轴,可以有任意条线条。
1. 一个chart可以包含多个chartArea。 chartArea是具体的坐标区域。
2. 每一个chartArea主要包含X轴,Y轴,副X轴(上方),副Y轴(右方),绑定的线条,绑定的图例。
3. 线条可以有许多,只要将线条绑定到chartArea就可以在对应的chartArea显示。
4. 其树形实体结构如下所示: 对于每个实体里面的许多样式属性可以自行尝试研究。

这里写图片描述
图 1 Chart树形结构

chart控件的属性很多,主要用到Chart控件图表区域的属性有五个属性
1.Annotations :批注集合(我没怎么用到,但是配置的话会在图标区域出现一些可以备注的东西吧)
2.ChartAreas: 图表区属性;主要设置图标数据的背景,比如3D或者隐藏还是显示横纵轴交叉线,分块颜色显示等
3.Lengends: 图表图例集合 主要设置图表边说明的一些东西,这次项目没什么用到,但是觉得这个基本没啥用,有什么说明一般都另外添加的,用不到自带的属性
4.Series :图表序列属性,chart设置中基本大多数的设置都在这里了,用来设置数据的一下外观,数据类型(饼图,折线图,树状图等等)
5.Title: 图表标题集合,用来设置图表的标题
6.ToolTip:映射区:鼠标放在数据点上出现的小提示,建议用代码控制

这里写图片描述
图 2 Chart图例

主要内容

重要的是各种属性和方法的使用:
1.ChartAreas属性

ChartAreas属性指绘图区,一个控件可以有多个绘图区,比如我要在同一个控件内显示饼图和柱状图,肯定不能放在同一个ChartAreas区域内,应该在同一个Chart控件里增加两个ChartAreas并分别绑定Series对象。所以ChartAreas属性对应的是一个集合。

2.Series属性

Series属性就是各种图表的图形啦,比如我们要显示某月的天气变化,那么应该有这样两组数据,一组是天数,一组是每天对应的温度值,同时绑定到Series对象中,再将Series对象Add()到Chart控件的Series属性里即可。为了横向比较,例如我要看本月与上月的天气曲线变化图,并同时显示在同一个ChartAreas中,那该怎么办呢?很简单,再实例一个Series对象,将上月的天数数组与温度值数组绑定到一个新的Series2实例中,再将Series2实例Add()到Chart控件的Series属性里,此时,Chart控件的第一个绘图区ChartArea里就会有两条曲线。

3.Legends属性

Legend就是指一个图标的图例,当一个Series属性有多个Series时,或是一个Series有几组数据时,为了区分各自的颜色,通常每个Serie对象一种颜色,这就需要用到图例来指明哪个颜色的代表的是什么数据。如下图所示:

简单实践

以下是学习代码

 public partial class Form1 : Form
    {
        Series mSeries = new Series();
         Random r = new Random();
         //存放y轴数据的数组链表
         private List<int> DataL = new List<int>();
         Timer DynaT = new Timer();
        //图表区域
         ChartArea chartarea = new ChartArea ();

        public Form1()
        {
            InitializeComponent();
             DynaT.Interval = 300;
             DynaT.Tick += DynaT_Tick;
             //数据数组
             for (int i = 0; i < 40; i++)
             {
                 DataL.Add(i);
             }
             creatchart();
        }

        void DynaT_Tick(object sender, EventArgs e)
        {
            DataL.RemoveAt(0);//移除链表第一个
            int N =r.Next (50);
            DataL.Insert(DataL.Count, N);
            //绑定数据
            mSeries.Points.DataBindY(DataL);
            //重绘
            chart1.Series.Invalidate ();
        }
        private void Form1_Load(object sender, EventArgs e)
        {
           DynaT.Start();  
        }

        private void creatchart()
        {
       //图表设置
            chartarea.AxisX.Interval = 2;
            chartarea.AxisY.Interval = 2;
            this.chart1.ChartAreas.Add(chartarea);

            mSeries.ChartType = SeriesChartType.Spline;
            mSeries.Points.DataBindY(DataL);

            mLegend.Name = "随机数组";
            mLegend.Docking = Docking.Right ;
            mLegend.DockedToChartArea = chartarea.Name;//将图例放在所在表中
            mLegend.IsDockedInsideChartArea = true ;

            mSeries.LegendToolTip = "随机数据";// 鼠标放到系列上出现的文字  
            mSeries.LegendText = "随机数组";// 系列名字  

            mSeries.ChartArea = chartarea.Name ; 
            chart1.Series.Add(mSeries);
            chart1.Legends.Add(mLegend);

            //线属性设置
            chart1.Series [0].IsValueShownAsLabel = true;//是否显示值
            chart1.Series[0].MarkerStyle = MarkerStyle.Circle;//标记点形状
            chart1.Series[0].MarkerSize = 10;//标记点大小
            chart1.Series[0].MarkerColor = Color.Tomato;//标记点颜色
        }
  }

测试图例

这里写图片描述
图 3 测试范例

数据绑定

其余笔记:
其中绑定数据源,得到折线图的方法有两种。

1、读取数据库,得到数据集,绑定对应列得到折线图:

DataSet ds = 读取数据库;
DataView dv=new DataView(ds.Tables[0]);
this.chart1.Series[0].ChartType=SeriesChartType.Line; 
this.chart1.Series[0].Points.DataBindXY(dv, "时间列列名",dv, "温度列列名");


 //创建表,添加数据
            DataTable dt = new DataTable();
            dt.Columns.Add("月份");
            dt.Columns.Add("数量");

 //绑定表格数据
            DataTable dt = default(DataTable);
            dt = CreateDataTable();
            //dt = GetTable();
            //设置图表的数据源
  //绑定数据
            crtShow.DataBind();    

//数据库操作
  public DataTable GetTable()
    {
        //连接SQL数据库,绑定数据
        string collectionstring = "server=(local);database=Wsbm_db;Trusted_Connection=SSPI";
        SqlConnection conn = new SqlConnection(collectionstring);
        SqlDataAdapter sad = new SqlDataAdapter("select * from grades ", conn);
        DataSet ds = new DataSet();
        sad.Fill(ds, "grades");
        conn.Close();
        return ds.Tables[0];
    }


2、读取数据库,得到数据列表,绑定列表得到折线图:

List<DateTime> x = 读取数据库得到时间列表;
List<double> y = 读取数据库得到温度列表;
this.chart1.Series[0].ChartType=SeriesChartType.Line; 
this.chart1.Series[0].Points.DataBindXY(x,y);
  • 0
    点赞
  • 0
    评论
  • 10
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

©️2021 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值