none
How to use Chart / Graph with the datagridview in VB RRS feed

  • Question

  • I have a form that has a datagridview, 3 textboxes which are, ID, product, and money. I have a button that adds the textbox information to the datagridview. The datagridview has 3 columns. ID, product, and money.

    My question is, how do you program a chart in visual basic to display the product in the X-axis and the money in the Y-axis from the datagridview on button click. The chart type should be a column chart.

    Thursday, July 9, 2015 6:57 AM

Answers

  • Hi,

    put a DataGridView and a Chart-Control to Form1 of a new WindowsForms Project and paste the code

    Option Strict On
    Public Class Form1
        Dim m_Rnd As New Random
    
        Private Sub Form1_Load(sender As System.Object, e As System.EventArgs) Handles MyBase.Load
            Dim dt As New DataTable
    
            dt.Columns.Add("Id", GetType(Integer))
            dt.Columns.Add("Product", GetType(String))
            dt.Columns.Add("Money", GetType(Integer))
    
            For i As Integer = 0 To 9
                Dim dr As DataRow = dt.NewRow
    
                dr(0) = i
                dr(1) = "ProductNo" & i.ToString()
                dr(2) = m_Rnd.Next(2000)
    
                dt.Rows.Add(dr)
            Next
    
            Me.DataGridView1.DataSource = dt.DefaultView
            Me.Chart1.DataSource = dt
    
            Chart1.Series(0).XValueMember = "Product"
            Chart1.Series(0).YValueMembers = "Money"
            Chart1.DataBind()
        End Sub
    End Class

    Regards,

      Thorsten

    Thursday, July 9, 2015 10:48 AM
  • ... and here's example code for a button to add data:

        Dim _i As Integer = 0
    
        Private Sub Button1_Click(sender As System.Object, e As System.EventArgs) Handles Button1.Click
            Dim dt As DataTable = CType(Me.DataGridView1.DataSource, DataView).Table
            Dim dr As DataRow = dt.NewRow
    
            dr(0) = _i
            dr(1) = "ProductNo" & _i.ToString()
            dr(2) = m_Rnd.Next(2000)
    
            _i += 1
    
            dt.Rows.Add(dr)
    
            Chart1.DataBind()
        End Sub

    Regards,

      Thorsten

    Thursday, July 9, 2015 10:54 AM
  • ... and here's an example showing a "selection line" in the chart when you select an item in the Datagridview.

    Put a DatagridView, a Chart and a button to Form1 of a new WinFormsProject and paste the code

    Option Strict On
    
    Public Class Form1
        Dim m_Rnd As New Random
        Dim m_dontDo As Boolean
        Dim m_x As Integer
        Dim m_i As Integer = 0
    
        Private Sub Form1_Load(sender As System.Object, e As System.EventArgs) Handles MyBase.Load
            Dim dt As New DataTable
    
            dt.Columns.Add("Id", GetType(Integer))
            dt.Columns.Add("Product", GetType(String))
            dt.Columns.Add("Money", GetType(Integer))
    
            For i As Integer = 0 To 9
                Dim dr As DataRow = dt.NewRow
    
                dr(0) = i
                dr(1) = "ProductNo" & i.ToString()
                dr(2) = m_Rnd.Next(2000)
    
                dt.Rows.Add(dr)
            Next
    
            m_i = 10
    
            Me.DataGridView1.DataSource = dt.DefaultView
            Me.Chart1.DataSource = dt
    
            Chart1.Series(0).XValueMember = "Product"
            Chart1.Series(0).YValueMembers = "Money"
            Chart1.DataBind()
        End Sub
    
        Private Sub Button1_Click(sender As System.Object, e As System.EventArgs) Handles Button1.Click
            Dim dt As DataTable = CType(Me.DataGridView1.DataSource, DataView).Table
            Dim dr As DataRow = dt.NewRow
    
            dr(0) = m_i
            dr(1) = "ProductNo" & m_i.ToString()
            dr(2) = m_Rnd.Next(2000)
    
            m_i += 1
    
            dt.Rows.Add(dr)
    
            Chart1.DataBind()
        End Sub
    
        Private Sub chart1_PostPaint(sender As Object, e As System.Windows.Forms.DataVisualization.Charting.ChartPaintEventArgs) Handles Chart1.PostPaint
            Dim o As Object = e.ChartElement
    
            If o.[GetType]().Equals(GetType(System.Windows.Forms.DataVisualization.Charting.Series)) Then
                Dim xVal As Single = CSng(e.ChartGraphics.GetPositionFromAxis(e.Chart.ChartAreas(0).Name, System.Windows.Forms.DataVisualization.Charting.AxisName.X, m_x))
                Dim pt As PointF = e.ChartGraphics.GetAbsolutePoint(New PointF(xVal, 0))
                e.ChartGraphics.Graphics.DrawLine(Pens.Red, pt, New PointF(pt.X, e.Chart.ClientSize.Height))
    
                If m_x - 1 > -1 AndAlso m_x - 1 < Me.DataGridView1.Rows.Count Then
                    m_dontDo = True
                    Me.DataGridView1.ClearSelection()
                    Me.DataGridView1.Rows(m_x - 1).Selected = True
                    m_dontDo = False
                End If
            End If
        End Sub
    
        Private Sub datagridview1_SelectionChanged(sender As Object, e As EventArgs) Handles DataGridView1.SelectionChanged
            If Not m_dontDo Then
                If Me.DataGridView1.SelectedRows.Count > 0 Then
                    m_x = Me.DataGridView1.SelectedRows(0).Index + 1
    
                ElseIf Me.DataGridView1.SelectedCells.Count > 0 Then
                    m_x = Me.DataGridView1.SelectedCells(0).RowIndex + 1
                End If
    
                Me.Chart1.Invalidate()
    
                Me.Chart1.[Select]()
            End If
        End Sub
    End Class

    Regards,

      Thorsten

    Thursday, July 9, 2015 11:05 AM

All replies

  • Hi,

    put a DataGridView and a Chart-Control to Form1 of a new WindowsForms Project and paste the code

    Option Strict On
    Public Class Form1
        Dim m_Rnd As New Random
    
        Private Sub Form1_Load(sender As System.Object, e As System.EventArgs) Handles MyBase.Load
            Dim dt As New DataTable
    
            dt.Columns.Add("Id", GetType(Integer))
            dt.Columns.Add("Product", GetType(String))
            dt.Columns.Add("Money", GetType(Integer))
    
            For i As Integer = 0 To 9
                Dim dr As DataRow = dt.NewRow
    
                dr(0) = i
                dr(1) = "ProductNo" & i.ToString()
                dr(2) = m_Rnd.Next(2000)
    
                dt.Rows.Add(dr)
            Next
    
            Me.DataGridView1.DataSource = dt.DefaultView
            Me.Chart1.DataSource = dt
    
            Chart1.Series(0).XValueMember = "Product"
            Chart1.Series(0).YValueMembers = "Money"
            Chart1.DataBind()
        End Sub
    End Class

    Regards,

      Thorsten

    Thursday, July 9, 2015 10:48 AM
  • ... and here's example code for a button to add data:

        Dim _i As Integer = 0
    
        Private Sub Button1_Click(sender As System.Object, e As System.EventArgs) Handles Button1.Click
            Dim dt As DataTable = CType(Me.DataGridView1.DataSource, DataView).Table
            Dim dr As DataRow = dt.NewRow
    
            dr(0) = _i
            dr(1) = "ProductNo" & _i.ToString()
            dr(2) = m_Rnd.Next(2000)
    
            _i += 1
    
            dt.Rows.Add(dr)
    
            Chart1.DataBind()
        End Sub

    Regards,

      Thorsten

    Thursday, July 9, 2015 10:54 AM
  • ... and here's an example showing a "selection line" in the chart when you select an item in the Datagridview.

    Put a DatagridView, a Chart and a button to Form1 of a new WinFormsProject and paste the code

    Option Strict On
    
    Public Class Form1
        Dim m_Rnd As New Random
        Dim m_dontDo As Boolean
        Dim m_x As Integer
        Dim m_i As Integer = 0
    
        Private Sub Form1_Load(sender As System.Object, e As System.EventArgs) Handles MyBase.Load
            Dim dt As New DataTable
    
            dt.Columns.Add("Id", GetType(Integer))
            dt.Columns.Add("Product", GetType(String))
            dt.Columns.Add("Money", GetType(Integer))
    
            For i As Integer = 0 To 9
                Dim dr As DataRow = dt.NewRow
    
                dr(0) = i
                dr(1) = "ProductNo" & i.ToString()
                dr(2) = m_Rnd.Next(2000)
    
                dt.Rows.Add(dr)
            Next
    
            m_i = 10
    
            Me.DataGridView1.DataSource = dt.DefaultView
            Me.Chart1.DataSource = dt
    
            Chart1.Series(0).XValueMember = "Product"
            Chart1.Series(0).YValueMembers = "Money"
            Chart1.DataBind()
        End Sub
    
        Private Sub Button1_Click(sender As System.Object, e As System.EventArgs) Handles Button1.Click
            Dim dt As DataTable = CType(Me.DataGridView1.DataSource, DataView).Table
            Dim dr As DataRow = dt.NewRow
    
            dr(0) = m_i
            dr(1) = "ProductNo" & m_i.ToString()
            dr(2) = m_Rnd.Next(2000)
    
            m_i += 1
    
            dt.Rows.Add(dr)
    
            Chart1.DataBind()
        End Sub
    
        Private Sub chart1_PostPaint(sender As Object, e As System.Windows.Forms.DataVisualization.Charting.ChartPaintEventArgs) Handles Chart1.PostPaint
            Dim o As Object = e.ChartElement
    
            If o.[GetType]().Equals(GetType(System.Windows.Forms.DataVisualization.Charting.Series)) Then
                Dim xVal As Single = CSng(e.ChartGraphics.GetPositionFromAxis(e.Chart.ChartAreas(0).Name, System.Windows.Forms.DataVisualization.Charting.AxisName.X, m_x))
                Dim pt As PointF = e.ChartGraphics.GetAbsolutePoint(New PointF(xVal, 0))
                e.ChartGraphics.Graphics.DrawLine(Pens.Red, pt, New PointF(pt.X, e.Chart.ClientSize.Height))
    
                If m_x - 1 > -1 AndAlso m_x - 1 < Me.DataGridView1.Rows.Count Then
                    m_dontDo = True
                    Me.DataGridView1.ClearSelection()
                    Me.DataGridView1.Rows(m_x - 1).Selected = True
                    m_dontDo = False
                End If
            End If
        End Sub
    
        Private Sub datagridview1_SelectionChanged(sender As Object, e As EventArgs) Handles DataGridView1.SelectionChanged
            If Not m_dontDo Then
                If Me.DataGridView1.SelectedRows.Count > 0 Then
                    m_x = Me.DataGridView1.SelectedRows(0).Index + 1
    
                ElseIf Me.DataGridView1.SelectedCells.Count > 0 Then
                    m_x = Me.DataGridView1.SelectedCells(0).RowIndex + 1
                End If
    
                Me.Chart1.Invalidate()
    
                Me.Chart1.[Select]()
            End If
        End Sub
    End Class

    Regards,

      Thorsten

    Thursday, July 9, 2015 11:05 AM