5
Menampilkan Data dalam bentuk Grafik dengan VB.NET
Tampilan data dengan grafik akan
memvisualisasikan secara jelas data suatu kasus dari database. Tutorial berikut
ini adalah tentang bagaimana cara kita menampilkan data dari database dalam
bentuk grafik sederhana.
Langkah 1 : Jalankan aplikasi Visual
Basic.NET
Langkah 2 : Buat Project baru dan desain
Form1 seperti gambar dibawah ini.
Langkah 3 : Atur properties control yang
ada di form1 seperti table berikut.
No.
|
Kontrol
|
Properties
|
1.
|
Label
|
Name : Label1
Text : Timoresse Grafik Data
|
2.
|
Label
|
Name : Label2
Text : Kupang
|
3.
|
Label
|
Name : Label3
Text : SoE
|
4.
|
Label
|
Name : Label4
Text : Kefamenanu
|
5.
|
Label
|
Name : Label5
Text : Atambua
|
6.
|
Label
|
Name : Label6
Text : Malaka
|
7.
|
TextBox
|
Name : TextBox1
Text : 6500
|
8.
|
TextBox
|
Name : TextBox2
Text : 5000
|
9.
|
TextBox
|
Name : TextBox3
Text : 4500
|
10.
|
TextBox
|
Name : TextBox4
Text : 6000
|
11.
|
TextBox
|
Name : TextBox5
Text : 3000
|
12.
|
Button
|
Name : Button1
Text : Buat Grafik
|
Langkah 4 : Masukan Script kode berikut
ini ke halaman code program dari form tersebut.
Public Class Form1 Inherits System.Windows.Forms.Form Dim graphDrawingArea As Graphics Dim bmpDrawingArea As Bitmap Private Sub Form1_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load bmpDrawingArea = New Bitmap(Width, Height) graphDrawingArea = Graphics.FromImage(bmpDrawingArea) End Sub Private Sub Form1_Paint(ByVal sender As Object, ByVal e As System.Windows.Forms.PaintEventArgs) Handles Me.Paint e.Graphics.DrawImage(bmpDrawingArea, 0, 0) End Sub Private Sub Button1_Click(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles Button1.Click Dim monday As Integer = CInt(Me.TextBox1.Text) / 100 Dim tuesday As Integer = CInt(Me.TextBox2.Text) / 100 Dim wednesday As Integer = CInt(Me.TextBox3.Text) / 100 Dim thursday As Integer = CInt(Me.TextBox4.Text) / 100 Dim friday As Integer = CInt(Me.TextBox5.Text) / 100 graphDrawingArea.Clear(Me.BackColor) graphDrawingArea.FillRectangle(New SolidBrush(Color.Red), Me.TextBox1.Left + 5, 280 - monday, 40, monday) graphDrawingArea.DrawRectangle(New Pen(Color.Black), Me.TextBox1.Left + 5, 280 - monday, 40, monday) graphDrawingArea.FillRectangle(New SolidBrush(Color.Blue), Me.TextBox2.Left + 5, 280 - tuesday, 40, tuesday) graphDrawingArea.DrawRectangle(New Pen(Color.Black), Me.TextBox2.Left + 5, 280 - tuesday, 40, tuesday) graphDrawingArea.FillRectangle(New SolidBrush(Color.Fuchsia), Me.TextBox3.Left + 5, 280 - wednesday, 40, wednesday) graphDrawingArea.DrawRectangle(New Pen(Color.Black), Me.TextBox3.Left + 5, 280 - wednesday, 40, wednesday) graphDrawingArea.FillRectangle(New SolidBrush(Color.Brown), Me.TextBox4.Left + 5, 280 - thursday, 40, thursday) graphDrawingArea.DrawRectangle(New Pen(Color.Black), Me.TextBox4.Left + 5, 280 - thursday, 40, thursday) graphDrawingArea.FillRectangle(New SolidBrush(Color.Turquoise), Me.TextBox5.Left + 5, 280 - friday, 40, friday) graphDrawingArea.DrawRectangle(New Pen(Color.Black), Me.TextBox5.Left + 5, 280 - friday, 40, friday) graphDrawingArea.DrawRectangle(New Pen(Color.Black), 10, 280, Width - 30, 1) Invalidate() End Sub End Class
Langkah 5 : Tekan F5 untuk running dan
testing program. Tekan tombol Buat Grafik maka akan tampil grafik seperti
gambar dibawah.
Demikian tutorial singkat membuat grafik
dengan visual basic.net
Semoga bermanfaat,
Terima kasih,
Download tutorial versi PDF klik disini