How to Show Data in Chart Control or Graph in VB6.0

In this post, SKOTechLearn will describe that how to Show data in Chart or graph in VB6.0. You can display data manually at run time or through database in Chart. We will describe the following process to display record or value in this control. Let’s take a look of following Process.

Show Value from Textbox to Chart Control

Show data from MS-Access Database to Chart Control

Show data from Listview or MSHFlexGrid to Chart Control

So, We start this process with above given point.

(1) Show Value from Textbox to Chart Control:

If you want to display value from text box to chart graph, you have to drag some text box to you form. Whenever we want to change the value of any TextBoxes, the graph will automatically update in run time.

Learn Chart design with special features in VB6.0

Suppose we drag some controls and change its name like bellow.

Control	Name
MSChart1	MyChart1
Text1	TxtVal1
Text2	TxtVal2
Text3	TxtVal3
Text4	TxtVal4
Command1	Databtn1

Now, we will drag command button with name "Databtn1", we will write code inside Databtn1’s Click() event as described bellow.

Private Sub Databtn1_Click()
   ReDim grpdtarr(1 To 4)
    With MyChart1
      .Legend.Location.Visible = True
      'arrprices describes every plot value
       grpdtarr(1) = Val(TxtVal1.Text)
       grpdtarr(2) = Val(TxtVal2.Text)
       grpdtarr(3) = Val(TxtVal3.Text)
       grpdtarr(4) = Val(TxtVal4.Text)

       'SeriesCollection describes plot's series description
       .Plot.SeriesCollection(1).LegendText = "Text Value1: " & TxtVal1.Text
       .Plot.SeriesCollection(2).LegendText = "Text Value2: " & TxtVal2.Text
       .Plot.SeriesCollection(3).LegendText = "Text Value3: " & TxtVal3.Text
       .Plot.SeriesCollection(4).LegendText = "Text Value4: " & TxtVal4.Text

       .TitleText = "My Graph"
       'array add  record to chart
       .ChartData = grpdtarr
  End With

End Sub

Now, let’s take a look of output during run time such as bellow image.

Text value in Graph Plot

The above given figure present the output of change graph Plot through Textbox value change in VB6.0.

(2) Show data from MS-Access Database to Chart Control:

In this time mainly Chart control uses to display record from database. Now we create DB in MS-Access.

Design DB through following process:

DB Name:	ChartDB
Table Name:	Graph_Tbl
Field Name With Record:
Srn	Pr_Details	Pr_Phone	Tot_Cost
1	ABFCD	002220011111	130
2	NLMPO	001332224333	1550
3	SKOJH	114444220000	590
4	RJPQS	115699990080	270

For this process, we will create DB in “C:\” drive. After designing DB with table and records, come to VB application and drag ADODC control from Component for DB connection.

Suppose we connect “Tot_Cost” records in graph. So First we have to connect DB with this control.

So, the following code will describe the connection and DB record presentation on Graph Plot.

Here we will drag command button and change its name with “DBDataShow_Btn” and write code in its Click() event as described bellow.

Private Sub DBDataShow_Btn_Click()
  Public cnnct As New ADODB.Connection  
  cnnct.Open "Provider=Microsoft.Jet.OLEDB.4.0;Data Source=C:\ChartDB.mdb;Persist Security Info=False"

  Dim tot1 As Long
  tot1 = 0
  Dim rscnt As New ADODB.Recordset
  rscnt.Open "SELECT Count(Srn) AS CountOfSrn FROM Graph_Tbl;", cnnct, adOpenKeyset, adLockOptimistic 
  tot1 = rscnt!CountOfSrn
  rscnt.Close

  ReDim grpdtarr1(1 To tot1)
  Dim i As Double
  i = 1
  MyChart1.Legend.Location.Visible = True
  Dim rcd As New ADODB.Recordset
  rcd.Open "Select * from Graph_Tbl;", cnnct, adOpenKeyset, adLockOptimistic
  While Not rcd.EOF

    grpdtarr1(i) = Val(rcd!Tot_Cost)
    MyChart1.Plot.SeriesCollection(i).LegendText = rcd!Pr_Details & " (" & Val(rcd!Tot_Cost) & ")"

    i = i + 1
    rcd.MoveNext
  Wend
  rcd.Close

  MyChart1.TitleText = "Cost Details"
  MyChart1.ChartData = grpdtarr1

  cnnct. Close
End Sub

Database record show in Graph Plot or Chart

Database record in Graph Plot

The above code description and image process is easily understandable.

(3) Show data from Listview or MSHFlexGrid to Chart Control:

For this process, we have to add Listview component and add MSHFlexgrid component to ToolBox. First of all you have to add some record in Listview or MSHFlexGrid Table.

(a) Show data from ListView to Chart Control

Suppose, we contain a Listview record with column name (KNO, D_NM, Percent). And Every column contain some records. We will drag a command button with Name “LSTShowDT_Btn”.

Now, we will write code in its Click() event for display Listview record in graph.

Private Sub LSTShowDT_Btn_Click()
 ReDim Lstgprarr(1 To ListView1.ListItems.Count)
 With MyChart1
   .Legend.Location.Visible = True

   Lstgprarr(1) = Val(ListView1.ListItems(1).ListSubItems(2).Text)
   Lstgprarr(2) = Val(ListView1.ListItems(2).ListSubItems(2).Text)
   Lstgprarr(3) = Val(ListView1.ListItems(3).ListSubItems(2).Text)

   .Plot.SeriesCollection(1).LegendText = "KNO: " & ListView1.ListItems(1).ListSubItems(2).Text
   .Plot.SeriesCollection(2).LegendText = "D_NM: " & ListView1.ListItems(2).ListSubItems(2).Text
   .Plot.SeriesCollection(3).LegendText = "Percent: " & ListView1.ListItems(3).ListSubItems(2).Text

   .TitleText = "My Graph"
   'array add record to chart
   .ChartData = Lstgprarr
 End With
End Sub

When you run application, and press on “LSTShowDT_Btn” button. You will find that all records from Listview will be present in Graph Plot such as given bellow figure.

Listview Data Show in Graph Plot or Chart

Listview record in Graph Plot

(b) Show data from MSHFlexGrid to Chart Control

Suppose, MSHFlexGrid containing some column header with records such as (KNO, PNM, P_Price). Like Listview, you have to add some record in MSHFlexGrid. Suppose, we add 4 records in MSHFlexGrid.

Note: MSHFlexGrid and ListView code process is totally different. Both have its own process to get or display record.

Now, we drag a Command Button with change Name “MSHFShowDT_Btn”. Write code in its Click() event such as bellow:

Private Sub MSHFShowDT_Btn_Click()
 ReDim Flxgrparr(1 To MSHFlexGrid1.Rows - 2)

 With MyChart1
   .Legend.Location.Visible = True

   'arrprices describes every plot value
   Flxgrparr(1) = Val(MSHFlexGrid1.TextMatrix(1, 2))
   Flxgrparr(2) = Val(MSHFlexGrid1.TextMatrix(2, 2))
   Flxgrparr(3) = Val(MSHFlexGrid1.TextMatrix(3, 2))
   Flxgrparr(4) = Val(MSHFlexGrid1.TextMatrix(4, 2))

   'SeriesCollection describes plot's series description
   .Plot.SeriesCollection(1).LegendText = MSHFlexGrid1.TextMatrix(1, 1) & " : " & MSHFlexGrid1.TextMatrix(1, 2)
   .Plot.SeriesCollection(2).LegendText = MSHFlexGrid1.TextMatrix(2, 1) & " : " & MSHFlexGrid1.TextMatrix(2, 2)
   .Plot.SeriesCollection(3).LegendText = MSHFlexGrid1.TextMatrix(3, 1) & " : " & MSHFlexGrid1.TextMatrix(3, 2)
   .Plot.SeriesCollection(4).LegendText = MSHFlexGrid1.TextMatrix(4, 1) & " : " & MSHFlexGrid1.TextMatrix(4, 2)

   .TitleText = "My Graph"
   'array add record to chart
   .ChartData = Flxgrparr 
  End With

End Sub

Let’s take a look of output during run time of application in bellow figure.

MSHFlexGrid Data Show in Graph Plot or Chart

MSHFlexGrid record in Graph Plot

So, you can easily display records in Chart control through Textbox, ListView and MSHFlexGrid. There is some more way to display records through Listbox, SQL DB, Oracle, Excel etc.

Get DB record in MSHFlexGrid with easy tips

If you will understand these steps, you can put your logical point of view to design this type of application.

Now, you can try to learn How to Show Data in Chart Control or Graph in VB6.0 easy tips with SKOTechLearn.