1. 程式人生 > 實用技巧 >C#--圖示控制元件Chart使用

C#--圖示控制元件Chart使用

以下是學習筆記:

效果如下:

1,新增Chart資料實體類

 /// <summary>
    /// Chart資料實體類
    /// </summary>
    public class ChartData
    {
        public ChartData() { }
        public ChartData(string text, double value)
        {
            this.Text = text;
            this.Value = value;
        }
        /// <summary>
        /// 顯示的文字
        /// </summary>
        public string Text { get; set; }
        /// <summary>
        /// 顯示的值
        /// </summary>
        public double  Value { get; set; }
    }

  2,新增Chart屬性設定的類,通用的類

    /// <summary>
    /// 高階圖表設定類,通用類
    /// </summary>
    public class SuperChart
    {
        //當前要使用的圖表控制元件物件
        private Chart chart = null;
        public SuperChart(Chart chart)
        {
            this.chart = chart;
        }

        /// <summary>
        /// 繪製圖表的通用方法
        /// </summary>
        /// <param name="chartType">圖表顯示的型別</param>
        /// <param name="dataList">圖表所需要的資料</param>
        public void ShowChart(SeriesChartType chartType, List<ChartData> dataList)
        {
            //【1】清除所有的圖表序列
            this.chart.Series.Clear();

            //【2】建立一個圖表序列物件(一個圖表,可以新增多個圖表序列,也就是繪圖物件),如果有多條曲線的顯示
            Series series1 = new Series();
            series1.ChartType = chartType;//設定圖表序列物件顯示的型別
            this.chart.Series.Add(series1);//新增到圖表序列集合

            //【3】設定當前圖表序列的各種屬性值
            for (int i = 0; i < dataList.Count ; i++)
            {
                //3.1 獲取資料物件的兩個值
                string text = dataList[i].Text;
                double value = dataList[i].Value;

                //3.2 使用x和y的值將DataPoint物件新增進去
                series1.Points.AddXY(text, value);

                //3.3 設定資料點顯示內容
                series1.Points[i].LabelToolTip = value.ToString();//滑鼠放到標籤上面的提示
                series1.Points[i].ToolTip = value.ToString();//圖形上面的提示,在一個區域裡面顯示

                //3.4 根據圖形樣式設定顯示的形式和內容
                if (chartType == SeriesChartType.Pie)//如果是餅形圖
                {
                    // series1.Points[i].Label = "#AXISLABEL(#VAL)";//設定標籤顯示的內容=X軸內容+value
                    series1.Points[i].Label = "#AXISLABEL(#PERCENT)";//X軸+百分比
                                                                     // series1.Points[i].Label = "#AXISLABEL(#VAL)(#PERCENT)";
                    series1["PieLabelStyle"] = "Outside"; //在外側顯示Lable
                                                          // series1["PieLabelStyle"] = "Inside";
                    series1["PieLineColor"] = "Black";//繪製連線
                }
                else if (chartType == SeriesChartType.Doughnut)//圓環圖
                {
                    series1.Points[i].Label = "#AXISLABEL   (#PERCENT)";
                    series1["PieLabelStyle"] = "Inside";
                }
                else //如果是其他圖形,顯示百分比或數值
                {
                    series1.Points[i].Label = "(#PERCENT)";
                }
                if (chartType != SeriesChartType.Pie)
                {
                    series1.Points[i].AxisLabel = string.Format("{0} {1}", text, value);
                }
            }
            //【4】設定圖表繪圖區域的X和Y座標值(Y:表示具體要顯示的數值之間的間隔)
            this.chart.ChartAreas[0].AxisY.Interval = 10;//也可以設定成20
            this.chart.ChartAreas[0].AxisX.Interval = 1; //一般都設定為1
        }
    }

  餅形圖說明:

3,在窗體中使用,窗體程式碼:

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;

//引用名稱空間
using System.Windows.Forms.DataVisualization.Charting;

namespace UseChartDemo
{
    public partial class FrmChart : Form
    {
        private SuperChart superChart = null;
        private List<ChartData> dataList = new List<ChartData>();//用來儲存資料的集合
        public FrmChart()
        {
            InitializeComponent();

            //初始化自定義圖表設定物件
            superChart = new SuperChart(this.chart1);
            Init();//實際開發中,可以從資料庫或其他資料來源查詢
        }
        private void Init()
        {
            //建立一個隨機數用來生成資料
            Random random = new Random();
            dataList.Add(new ChartData("北京", random.Next(100)));
            dataList.Add(new ChartData("上海", random.Next(100)));
            dataList.Add(new ChartData("天津", random.Next(100)));
            dataList.Add(new ChartData("深圳", random.Next(100)));
            dataList.Add(new ChartData("南京", random.Next(100)));
        }


        //顯示餅形圖
        private void btnPie_Click(object sender, EventArgs e)
        {
            this.superChart.ShowChart(SeriesChartType.Pie, dataList);
        }
        //顯示柱狀圖
        private void btnColumn_Click(object sender, EventArgs e)
        {
            this.superChart.ShowChart(SeriesChartType.Column, dataList);
        }
        //折線圖
        private void btnLine_Click(object sender, EventArgs e)
        {
            this.superChart.ShowChart(SeriesChartType.Line, dataList);
        }
        //橫條圖
        private void btnBar_Click(object sender, EventArgs e)
        {
            this.superChart.ShowChart(SeriesChartType.Bar, dataList);
        }
        //圓環圖
        private void btnDoughnut_Click(object sender, EventArgs e)
        {
            this.superChart.ShowChart(SeriesChartType.Doughnut, dataList);
        }
        //樣條圖
        private void btnSpline_Click(object sender, EventArgs e)
        {
            this.superChart.ShowChart(SeriesChartType.Spline, dataList);
        }
        //樣條面積圖
        private void btnSplineArea_Click(object sender, EventArgs e)
        {
            this.superChart.ShowChart(SeriesChartType.SplineArea, dataList);
        }
    }
}