Telerik®RadChartView控件WinForm中的简单使用（线形图/曲线图）

Telerik®RadChartView控件WinForm中的简单使用（线形图/曲线图）

一、线形图

样式展示

步骤及代码
1.拖一个RadChartView到Form里面，命名为trendsChartView（便于与下面代码对应，可根据情况自行命名）。
2.在界面初始化时也初始化该控件，注释详细介绍了各功能。为方便演示，初始化时我也从Sql Server数据库中加载了数据到DataTable中，Sql Server数据数据库结构参考Telerik®RadChartView控件WinForm中的简单使用（柱状图）文末。

public Form1()
{
    InitializeComponent();
    /*线形图*/
    this.trendsChartView.Area.View.Palette = KnownPalette.Spring;//设置主题样式(鼠标右键可自行更改)
    this.trendsChartView.ShowTitle = true;//显示标题
    this.trendsChartView.Title = "线形图展示测试";//标题名称
    this.trendsChartView.ChartElement.TitleElement.CustomFont = "宋体";//标题字体
    this.trendsChartView.ChartElement.TitleElement.CustomFontSize = 10f;//标题字体大小
    this.trendsChartView.ChartElement.TitleElement.TextAlignment = ContentAlignment.MiddleCenter;//标题显示位置
    LoadLineChart(dataTable);
}

3.显示加载数据。

private void LoadLineChart(DataTable bookings)
{
    LineSeries lineSeries = new LineSeries();//实例化第一个线条集合
    foreach (var booking in bookings.Select("UName='UA'"))
    {
        //添加值集合
        lineSeries.DataPoints.Add(new CategoricalDataPoint(Convert.ToInt32(booking["UValue"].ToString()), booking["UTime"].ToString()));
    }
    this.trendsChartView.Series.Add(lineSeries);

    LineSeries lineSeries2 = new LineSeries();//实例化第二个线条集合
    foreach (var booking in bookings.Select("UName='UB'"))
    {
        //添加值集合
        lineSeries2.DataPoints.Add(new CategoricalDataPoint(Convert.ToInt32(booking["UValue"].ToString()), booking["UTime"].ToString()));
    }
    this.trendsChartView.Series.Add(lineSeries2);
    
    /*添加Y轴线数据*/
    LinearAxis trendsVerticalAxis = lineSeries.VerticalAxis as LinearAxis;
    //trendsVerticalAxis.BorderColor = Color.FromArgb(209, 209, 209);//设置刻度/刻度值/边框颜色
    trendsVerticalAxis.CustomFont = "微软雅黑";//刻度值字体
    trendsVerticalAxis.CustomFontSize = 10f;//刻度值大小
    trendsVerticalAxis.Minimum = 0;//刻度值最小值
    //trendsVerticalAxis.Maximum = Math.Max(verticalMaxValue, 5);//刻度值最大值
    trendsVerticalAxis.MajorStep = 10;//刻度值间隔0 10 20 30.....

    /*添加X轴线数据*/
    CategoricalAxis trendsHorizontalAxis = lineSeries.HorizontalAxis as CategoricalAxis;
    trendsHorizontalAxis.MajorTickInterval = 1;//刻度值间隔
    trendsHorizontalAxis.LabelFitMode = AxisLabelFitMode.MultiLine;//刻度值显示样式(水平/斜体)
    //trendsHorizontalAxis.ClipLabels = true;
    trendsHorizontalAxis.CustomFont = "微软雅黑";//刻度值字体
    trendsHorizontalAxis.CustomFontSize = 10f;//刻度值大小
    trendsHorizontalAxis.PlotMode = AxisPlotMode.BetweenTicks;//图表模式
    //trendsHorizontalAxis.LabelFormat = "{0:dd/MM/yyyy}";
    //trendsHorizontalAxis.BorderColor = Color.FromArgb(209, 209, 209);设置刻度/刻度值/边框颜色

    this.trendsChartView.ChartElement.View.Margin = new Padding(100, 20, 40, 10);
    this.trendsChartView.ChartElement.InvalidateMeasure(true);
    this.trendsChartView.ChartElement.UpdateLayout();
}

二、曲线图

样式展示

步骤及代码
方法步骤与以上线形图相同，只需要在实例化LineSeries后将Spline属性设置为true即可。

LineSeries lineSeries = new LineSeries();//实例化第一个线条集合
lineSeries.Spline = true;//设置曲线
foreach (var booking in bookings.Select("UName='UA'"))
{
    //添加值集合
    lineSeries.DataPoints.Add(new CategoricalDataPoint(Convert.ToInt32(booking["UValue"].ToString()), booking["UTime"].ToString()));
}
this.trendsChartView.Series.Add(lineSeries);

LineSeries lineSeries2 = new LineSeries();//实例化第二个线条集合
lineSeries2.Spline = true;//设置曲线
foreach (var booking in bookings.Select("UName='UB'"))
{
    //添加值集合
    lineSeries2.DataPoints.Add(new CategoricalDataPoint(Convert.ToInt32(booking["UValue"].ToString()), booking["UTime"].ToString()));
}
this.trendsChartView.Series.Add(lineSeries2);

三、Legend显示

Legend:图表中各Series所代表的名称,如下图中绿色为UA/粉色为UB。

1.通过在实例化LineSeries后，将LegendTitle设置对应Legend名称。

lineSeries.LegendTitle = "UA";

2.将RadChartView的ShowLegend设置成true;

this.trendsChartView.ShowLegend = true;

图例

线形面积/曲线面积图正在研究中
本章完