chart控件的使用
本文介绍如何使用工具箱里的chart控件,绘制多条曲线。效果图如下:
1.initializechart
在窗体里添加chart控件,然后在属性里清空chartareas、legends和series集合,它们会由下面代码动态实现。在窗体构造函数里,实现initializechart和drawseries方法。
initializechart代码如下。
public partial class mainformbert : form
{
public mainformbert()
{
initializecomponent();
initializechart();
drawseries();
}
public void initializechart()
{ #region 设置图表的属性
//图表的背景色
chart1.backcolor = color.fromargb(211, 223, 240);
//图表背景色的渐变方式
chart1.backgradientstyle = gradientstyle.none;
//图表的边框颜色、
chart1.borderlinecolor = color.fromargb(26, 59, 105);
//图表的边框线条样式
chart1.borderlinedashstyle = chartdashstyle.solid;
//图表边框线条的宽度
chart1.borderlinewidth = 2;
//图表边框的皮肤
chart1.borderskin.skinstyle = borderskinstyle.none;
#endregion
#region 设置图表的title
title title = new title();
//标题内容
title.text = "ber";
//标题的字体
title.font = new system.drawing.font("microsoft sans serif", 12, fontstyle.regular);
//标题字体颜色
//title.forecolor = color.fromargb(26, 59, 105);
//标题阴影颜色
//title.shadowcolor = color.fromargb(32, 0, 0, 0);
//标题阴影偏移量
//title.shadowoffset = 3;
chart1.titles.add(title);
#endregion
#region 设置图表区属性
//图表区的名字
chartarea chartarea = new chartarea("default");
//背景色
chartarea.backcolor = color.white;// color.fromargb(64, 165, 191, 228);
//背景渐变方式
chartarea.backgradientstyle = gradientstyle.none;
//渐变和阴影的辅助背景色
chartarea.backsecondarycolor = color.white;
//边框颜色
chartarea.bordercolor = color.blue;
//边框线条宽度
chartarea.borderwidth = 2;
//边框线条样式
chartarea.borderdashstyle = chartdashstyle.solid;
//阴影颜色
//chartarea.shadowcolor = color.transparent;
//设置x轴和y轴线条的颜色和宽度
chartarea.axisx.linecolor = color.fromargb(64, 64, 64, 64);
chartarea.axisx.linewidth = 1;
chartarea.axisy.linecolor = color.fromargb(64, 64, 64, 64);
chartarea.axisy.linewidth = 1;
//设置x轴和y轴的标题
//chartarea.axisx.title = "time";
//chartarea.axisy.title = "count";
//chartarea.axisx.titlefont = new system.drawing.font("microsoft sans serif", 10, fontstyle.regular);
//chartarea.axisy.titlefont = new system.drawing.font("microsoft sans serif", 10, fontstyle.regular);
//设置图表区网格横纵线条的颜色和宽度
chartarea.axisx.majorgrid.linecolor = color.fromargb(64, 64, 64, 64);
chartarea.axisx.majorgrid.linewidth = 1;
chartarea.axisy.majorgrid.linecolor = color.fromargb(64, 64, 64, 64);
chartarea.axisy.majorgrid.linewidth = 1;
chart1.chartareas.add(chartarea);
#endregion
#region 图例及图例的位置
legend legend = new legend();
legend.alignment = stringalignment.center;
legend.docking = docking.bottom;
legend.backcolor = color.transparent;
this.chart1.legends.add(legend);
#endregion
}
}
2.设置曲线样式
类型、颜色和宽度等
private series setseriesstyle(int i)
{
series series = new series(string.format("ch{0}", i + 1)); //series的类型
series.charttype = seriescharttype.line; //series的边框颜色
series.bordercolor = color.fromargb(180, 26, 59, 105); //线条宽度
series.borderwidth = 3; //线条阴影颜色
//series.shadowcolor = color.black;
//阴影宽度
//series.shadowoffset = 2;
//是否显示数据说明
series.isvisibleinlegend = true; //线条上数据点上是否有数据显示
series.isvalueshownaslabel = false; //线条上的数据点标志类型
series.markerstyle = markerstyle.none; //线条数据点的大小
//series.markersize = 8;
//线条颜色
switch (i)
{ case 0:
series.color = color.fromargb(220, 65, 140, 240); break; case 1:
series.color = color.fromargb(220, 224, 64, 10); break; case 2:
series.color = color.fromargb(220, 120, 150, 20); break; case 3:
series.color = color.fromargb(220, 12, 128, 232); break;
} return series;
}
3.绘制曲线
从datatable里获取数据,绘制四条曲线。
//绘制曲线
private void drawseries()
{
dt = new testdatatable();
dt.createtable(); for (int i = 0; i < 4; i++)
{
series series = this.setseriesstyle(i);
datarow[] foundrows; string expression = "ch = " + i;
foundrows = dt.select(expression); foreach (datarow row in foundrows)
{
series.points.addxy(row[0], row[2]);
} this.chart1.series.add(series);
}
}
4.显示或隐藏曲线
根据checkbox的状态显示和隐藏这四条曲线。
//显示隐藏曲线
private void disorplayseries(int i)
{ if (checkbox[i].checked)
{
datarow[] foundrows; string expression = "ch = " + i;
foundrows = dt.select(expression); foreach (datarow row in foundrows)
{ this.chart1.series[i].points.addxy(row[0], row[2]);
}
} else
{ this.chart1.series[i].points.clear();
}
}
以上就是 从0自学c#08--绘制曲线chart控件的内容。