圖表控件MsChart使用demo

chart 控件主要有 Titles 標題集合  Chart Area圖形顯示區域 Series圖表集合 Legends圖列的集合

（1）  常用事件：

1. Series1.Points.DataBind()綁定數據點集合，如果要在一個MSChart控件的一個繪圖區(ChartArea)內添加多個不同數據源的圖表，就用這個主動綁定數據集合的方法。可以將表中指定字段的值綁定到指定的坐標軸上。

2. MSChart1.DataBind()給整個MSChart綁定一個數據源，該MSChart中的圖表全部可以使用該數據源作為統計來源

（2）MSChart的元素組成，最常用的屬性包括：

ChartAreas：增加多個繪圖區域，每個繪圖區域包含獨立的圖表組、數據源，用於多個圖表類型在一個繪圖區不兼容時。

AlignmentOrientation：圖表區對齊方向，定義兩個繪圖區域間的對齊方式。

AlignmentStyle：圖表區對齊類型，定義圖表間用以對其的元素。

AlignWithChartArea：參照對齊的繪圖區名稱。

InnerPlotPosition：圖表在繪圖區內的位置屬性。

Auto：是否自動對齊。

Height：圖表在繪圖區內的高度（百分比，取值在0-100）

Width：圖表在繪圖區內的寬度（百分比，取值在0-100）

X,Y：圖表在繪圖區內左上角坐標

Position：繪圖區位置屬性，同InnerPlotPosition。

Name：繪圖區名稱。

Axis：坐標軸集合

Title：坐標軸標題

TitleAlignment：坐標軸標題對齊方式

Interval：軸刻度間隔大小

IntervalOffset：軸刻度偏移量大小

MinorGrid：次要輔助線

MinorTickMark：次要刻度線

MajorGrid：主要輔助線

MajorTickMark：主要刻度線

DataSourceID：MSChart的數據源。

Legends：圖例說明。

Palette：圖表外觀定義。

 

（3）Series：最重要的屬性，圖表集合，就是最終看到的餅圖、柱狀圖、線圖、點圖等構成的集合；可以將多種相互兼容的類型放在一個繪圖區域內，形成復合圖。

IsValueShownAsLabel：是否顯示數據點標簽，如果為true，在圖表中顯示每一個數據值

Label：數據點標簽文本

LabelFormat：數據點標簽文本格式

LabelAngle：標簽字體角度

Name：圖表名稱

Points：數據點集合

XValueType：橫坐標軸類型

YValueType：縱坐標軸類型

XValueMember：橫坐標綁定的數據源（如果數據源為Table，則填寫橫坐標要顯示的字段名稱）

YValueMembers：縱坐標綁定的數據源（如果數據源為Table，則填寫縱坐標要顯示的字段名稱，縱坐標可以有兩個）

ChartArea：圖表所屬的繪圖區域名稱

ChartType：圖表類型（柱形、餅形、線形、點形等）

Legend：圖表使用的圖例名稱

Titles：標題集合。

width：MSChart的寬度。

height：MSChart的高度。

 

4.例子

 

Public Class Form1

    Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
        Dim dt As DataTable
        dt = CreateDataTable()

        SetMSChartStyle()
        ConvertChart(dt)

        'databind
        Chart1.DataBind()
    End Sub

    Private Function CreateDataTable() As DataTable
        Dim dt As New DataTable
        'Add three columns to the DataTable
        dt.Columns.Add("Date") 'X
        dt.Columns.Add("Series1") 'data1
        dt.Columns.Add("Series2") 'data2
        dt.Columns.Add("Series3") 'data1
        dt.Columns.Add("Series4") 'data2
        dt.Columns.Add("Series5") 'data1
        dt.Columns.Add("Series6") 'data2

        Dim dr As DataRow
        'Add rows to the table which contains some random data for demonstration
        Dim rnd As New Random
        Dim i As Double
        For i = 10 To 24 Step 0.2
            dr = dt.NewRow()
            dr("Date") = i
            dr("Series1") = 3731 + rnd.Next(0, 1000)
            dr("Series2") = 4101 + rnd.Next(0, 1000)
            dr("Series3") = 3600 + rnd.Next(0, 1000)
            dr("Series4") = 4765 + rnd.Next(0, 1000)
            dr("Series5") = 3742 + rnd.Next(0, 1000)
            dr("Series6") = 4321 + rnd.Next(0, 1000)
            dt.Rows.Add(dr)
        Next

        CreateDataTable = dt
    End Function

    Private Sub ConvertChart(dt As DataTable)
        For Each dr As DataRow In dt.Rows
            Dim s As Double = dr("Date")
            Chart1.Series("Series1").Points.AddXY(s, dr("Series1"))
            Chart1.Series("Series2").Points.AddXY(s, dr("Series2"))
            Chart1.Series("Series3").Points.AddXY(s, dr("Series3"))
            Chart1.Series("Series4").Points.AddXY(s, dr("Series4"))
            Chart1.Series("Series5").Points.AddXY(s, dr("Series5"))
            Chart1.Series("Series6").Points.AddXY(s, dr("Series6"))
        Next
    End Sub


    '/ <summary>
    '/ 設置mschart樣式
    '/ </summary>
    Private Sub SetMSChartStyle()
        ' 坐標軸設置
        Chart1.ChartAreas(0).AxisY.IsMarginVisible = False
        Chart1.ChartAreas(0).AxisY.LabelStyle.Enabled = False
        Chart1.ChartAreas(0).AxisX.IsMarginVisible = False
        Chart1.ChartAreas(0).AxisX.LabelStyle.Enabled = False

        '設置當前X軸Label自動設置格式 = 關閉
        Chart1.ChartAreas(0).AxisX.LabelAutoFitStyle = DataVisualization.Charting.LabelAutoFitStyles.None

        ''設置當前X軸Label的雙行顯示格式= 關閉，這個會影響到Y軸線條的顯示
        Chart1.ChartAreas(0).AxisX.LabelStyle.IsStaggered = False
        ''.設置當前X軸Label的顯示間隔周期=1 （1個項目） （=2的意思： 間隔2個項目顯示...以此類推）
        'Chart1.ChartAreas(0).AxisX.LabelStyle.Interval = 1
        'X 軸坐標最大最小值
        Chart1.ChartAreas(0).AxisX.Minimum = 0
        Chart1.ChartAreas(0).AxisX.Maximum = 24

        'X 軸坐標最大最小值
        Chart1.ChartAreas(0).AxisY.Minimum = 0
        Chart1.ChartAreas(0).AxisY.Maximum = 5000

        ' 坐標軸刻度線不延長出來設置
        Chart1.ChartAreas(0).AxisX.MajorTickMark.Enabled = False
        Chart1.ChartAreas(0).AxisY.MajorTickMark.Enabled = False

        'X 次要輔助線設置
        Chart1.ChartAreas(0).AxisX.MinorGrid.Enabled = True
        'X 次要輔助線間距
        Chart1.ChartAreas(0).AxisX.MinorGrid.Interval = 0.5
        'X 次要輔助線顏色
        Chart1.ChartAreas(0).AxisX.MinorGrid.LineColor = Color.LightGray
        Chart1.ChartAreas(0).AxisX.MinorGrid.LineDashStyle = DataVisualization.Charting.ChartDashStyle.Dash

        'Y 次要輔助線設置
        Chart1.ChartAreas(0).AxisY.MinorGrid.Enabled = True
        'Y 次要輔助線間距
        Chart1.ChartAreas(0).AxisY.MinorGrid.Interval = 500
        'Y 次要輔助線顏色
        Chart1.ChartAreas(0).AxisY.MinorGrid.LineColor = Color.LightGray
        Chart1.ChartAreas(0).AxisY.MinorGrid.LineDashStyle = DataVisualization.Charting.ChartDashStyle.Dash

        'X 主要輔助線設置
        Chart1.ChartAreas(0).AxisX.MajorGrid.Enabled = True
        'X 主要輔助線間距
        Chart1.ChartAreas(0).AxisX.MajorGrid.Interval = 5
        'X 主要輔助線顏色
        Chart1.ChartAreas(0).AxisX.MajorGrid.LineColor = Color.Black
        Chart1.ChartAreas(0).AxisX.MajorGrid.LineDashStyle = DataVisualization.Charting.ChartDashStyle.Solid

        'Y 主要輔助線設置
        Chart1.ChartAreas(0).AxisY.MajorGrid.Enabled = True
        'Y 主要輔助線間距
        Chart1.ChartAreas(0).AxisY.MajorGrid.Interval = 1000
        'Chart1.ChartAreas(0).AxisY.MajorGrid.IntervalOffset = 1000
        'Y 主要輔助線顏色
        Chart1.ChartAreas(0).AxisY.MajorGrid.LineColor = System.Drawing.Color.FromArgb(CType(CType(64, Byte), Integer), CType(CType(0, Byte), Integer), CType(CType(64, Byte), Integer))
        Chart1.ChartAreas(0).AxisY.MajorGrid.LineDashStyle = DataVisualization.Charting.ChartDashStyle.Solid

        '坐標主要輔助線刻度間距
        Chart1.ChartAreas(0).AxisX.Interval = 1
        Chart1.ChartAreas(0).AxisY.Interval = 1000

        '邊框樣式設置
        Chart1.ChartAreas(0).BorderColor = Color.Black
        Chart1.ChartAreas(0).BorderDashStyle = DataVisualization.Charting.ChartDashStyle.Solid
        Chart1.ChartAreas(0).BorderWidth = 1

        '圖例文字
        'Chart1.Series["Series"].LegendText = "當前"

        '圖例位置、字體設置；坐標軸位置設定
        'Chart1.Legends[0].Position = new ElementPosition(10, 10, 88, 7)
        'Chart1.Legends[0].Font = new Font("宋體", 9)
        'Chart1.ChartAreas[0].InnerPlotPosition = new ElementPosition(1, 1, 1, 1)
    End Sub


    Private Sub CmbYMax_SelectedValueChanged(sender As Object, e As EventArgs) Handles CmbYMax.SelectedValueChanged
        Chart1.ChartAreas(0).AxisY.Maximum = CmbYMax.Text
    End Sub

    Private Sub CmbYMin_SelectedValueChanged(sender As Object, e As EventArgs) Handles CmbYMin.SelectedValueChanged
        Chart1.ChartAreas(0).AxisY.Minimum = CmbYMin.Text
    End Sub

    Private Sub CmbXMin_SelectedValueChanged(sender As Object, e As EventArgs) Handles CmbXMin.SelectedValueChanged
        Chart1.ChartAreas(0).AxisX.Minimum = Convert.ToDouble(CmbXMin.Text)
    End Sub

    Private Sub CmbXMax_SelectedValueChanged(sender As Object, e As EventArgs) Handles CmbXMax.SelectedValueChanged
        Chart1.ChartAreas(0).AxisX.Maximum = Convert.ToDouble(CmbXMax.Text)
    End Sub

    Private Sub CheckBox_1_CheckedChanged(sender As Object, e As EventArgs) Handles CheckBox_1.CheckedChanged, CheckBox_6.CheckedChanged, CheckBox_5.CheckedChanged, CheckBox_4.CheckedChanged, CheckBox_3.CheckedChanged, CheckBox_2.CheckedChanged
        If (sender.Name.Split("_").length = 2) Then
            Dim seriesName As String = "Series" + sender.Name.Split("_")(1)
            If sender.Checked = True Then
                Chart1.Series(seriesName).Enabled = True
            Else
                Chart1.Series(seriesName).Enabled = False
            End If
        End If
    End Sub
End Class