Pocket PC Developer Network / Articles /

Pie Chart in eVB

Kosuri RajaSekhar (kosuri_rajasekhar@yahoo.com), September 26, 2002.

Summary

This article helps you to display your data as a pie chart in eVB program. It gives a sample code that you can use and modify.

Introduction

Pictures speak better than words. This article helps you to display your data as a pie chart in eVB. We all know that programming in eVb is easier but drawing graphical charts like pie is not that easy as we dont have any predefined functions in Embedded VB to draw pie charts. The application has a form consisting of three controls PictureBox, textBox and a command Button. When You click on the command button, the pie chart and a legend is displayed in the Picture Box. when you click on one of the legendry boxes, details of that particular sector are displayed in the textbox.

What You Need

Preface

Before answering your question "How can I use this Pie Chart in my application?", let me first tell you what are the API calls and functions that have been used in this application. To your surprise, drawline and drawcircle are the only functions used in drawing the pie chart. Calculating the sectors and painting them is complicated and tricky. For those who aren't interested in the intricacies can directly add the form to their application and with minor changes done can represent their data as a pie chart.

In Command1_Click(), Initialize the variable max_values and the array input_values with the total number of values and actual values used in drawing the pie chart.

Here it is:

Private Sub Command1_Click() Command1.Enabled = False Dim input_values() As Integer Dim max_values As Integer max_values = 4 ReDim input_values(max_values) input_values(0) = 10 input_values(1) = 30 input_values(2) = 75 input_values(3) = 60 Draw_Pie (input_values) End Sub

Private Sub Draw_Pie(). This method does three important things

Private Sub Draw_Pie(values() As Integer) Const c_x = 1200 'axis co-ordinates Const c_y = 1200 'axis co-ordinates Const radius = 1200 'radius Dim angle() As Integer Dim pts() As Integer Dim i As Integer Dim total As Integer Dim cum_angle As Integer Dim x_off As Integer Dim y_off As Integer ReDim angle(UBound(values)) ReDim Info(UBound(values)) ReDim colour_matrix(UBound(values), 5) ReDim Info(UBound(values)) ReDim pts(UBound(values) + 1, 2) pb.DrawWidth = 1 total = 0 For i = 0 To UBound(values) - 1 total = total + values(i) Next For i = 0 To UBound(values) - 1 angle(i) = values(i) / total * 360 Info(i) = Round((values(i) / total) * 100, 2) & "%" Next cum_angle = 0 pts(0, 0) = c_x pts(0, 1) = c_y - radius For i = 0 To UBound(angle) - 2 cum_angle = cum_angle + angle(i) x_off = 0 y_off = 0 If cum_angle < 90 Then If (cum_angle Mod 90) < 45 Then y_off = radius x_off = calculate_offset(cum_angle Mod 90, radius) Else x_off = radius y_off = calculate_offset(90 - cum_angle Mod 90, radius) End If pts(i + 1, 0) = c_x + x_off pts(i + 1, 1) = c_y - y_off End If If cum_angle >= 90 And cum_angle < 180 Then If cum_angle Mod 90 < 45 Then x_off = radius y_off = calculate_offset(cum_angle Mod 90, radius) Else y_off = radius x_off = calculate_offset(90 - cum_angle Mod 90, radius) End If pts(i + 1, 0) = c_x + x_off pts(i + 1, 1) = c_y + y_off End If If cum_angle >= 180 And cum_angle < 270 Then If cum_angle Mod 90 < 45 Then y_off = radius x_off = calculate_offset(cum_angle Mod 90, radius) Else x_off = radius y_off = calculate_offset(90 - cum_angle Mod 90, radius) End If pts(i + 1, 0) = c_x - x_off pts(i + 1, 1) = c_y + y_off End If If cum_angle >= 270 And cum_angle < 360 Then If cum_angle Mod 90 < 45 Then x_off = radius y_off = calculate_offset(cum_angle Mod 90, radius) Else y_off = radius x_off = calculate_offset(90 - cum_angle Mod 90, radius) End If pts(i + 1, 0) = c_x - x_off pts(i + 1, 1) = c_y - y_off End If Next pts(UBound(angle), 0) = c_x pts(UBound(angle), 1) = c_y - radius '///////////////////////////// 'Fill colour logic '///////////////////////////// Dim x As Integer Dim y As Integer Dim r As Integer Dim g As Integer Dim b As Integer Dim x_box As Integer Dim y_box As Integer Dim tot_height_boxes If (UBound(pts) > 10) Then tot_height_boxes = 10 * 200 Else tot_height_boxes = UBound(pts) * 200 End If x_box = c_x + radius y_box = pb.Top + CInt((pb.Height - tot_height_boxes) / 2) r = 20 g = 58 b = 150 i = 1 colour_matrix(0, 0) = r colour_matrix(0, 1) = g colour_matrix(0, 2) = b y = c_y - radius x = c_x While x < c_x + radius If x > pts(i, 0) And y = pts(i, 1) And pts(i, 0) > pts(i - 1, 0) Then r = (b + 345) Mod 255 g = (r + 535) Mod 255 b = (g + 615) Mod 255 If (i < UBound(angle)) Then colour_matrix(i, 0) = r colour_matrix(i, 1) = g colour_matrix(i, 2) = b End If i = i + 1 End If pb.DrawLine c_x, c_y, x, y, RGB(r, g, b) x = x + 15 Wend x = c_x + radius y = c_y - radius While y < c_y + radius If y > pts(i, 1) And x = pts(i, 0) Then r = (b + 345) Mod 255 g = (r + 535) Mod 255 b = (g + 615) Mod 255 If (i < UBound(angle)) Then colour_matrix(i, 0) = r colour_matrix(i, 1) = g colour_matrix(i, 2) = b End If i = i + 1 End If pb.DrawLine c_x, c_y, x, y, RGB(r, g, b) y = y + 15 Wend y = c_y + radius x = c_x + radius While x > c_x - radius If x < pts(i, 0) And y = pts(i, 1) Then r = (b + 345) Mod 255 g = (r + 535) Mod 255 b = (g + 615) Mod 255 If (i < UBound(angle)) Then colour_matrix(i, 0) = r colour_matrix(i, 1) = g colour_matrix(i, 2) = b End If i = i + 1 End If pb.DrawLine c_x, c_y, x, y, RGB(r, g, b) x = x - 15 Wend x = c_x - radius y = c_y + radius While y > c_y - radius If y < pts(i, 1) And x = pts(i, 0) Then r = (b + 345) Mod 255 g = (r + 535) Mod 255 b = (g + 615) Mod 255 If (i < UBound(angle)) Then colour_matrix(i, 0) = r colour_matrix(i, 1) = g colour_matrix(i, 2) = b End If i = i + 1 End If pb.DrawLine c_x, c_y, x, y, RGB(r, g, b) y = y - 15 Wend y = c_y - radius x = c_x - radius While x < c_x If x > pts(i, 0) And y = pts(i, 1) And pts(i, 0) > pts(i - 1, 0) Then r = (b + 345) Mod 255 g = (r + 535) Mod 255 b = (g + 615) Mod 255 If (i < UBound(angle)) Then colour_matrix(i, 0) = r colour_matrix(i, 1) = g colour_matrix(i, 2) = b End If i = i + 1 End If pb.DrawLine c_x, c_y, x, y, RGB(r, g, b) x = x + 15 Wend pb.DrawLine c_x, c_y, c_x, y, RGB(r, g, b) pb.DrawWidth = 50 pb.DrawCircle c_x, c_y, radius + 150, RGB(255, 255, 255), 1 'pb.DrawWidth = 1 'pb.DrawCircle c_x, c_y, radius - 215, RGB(0, 0, 0), 1 '///////////////////////////// ' Draw Legend Boxes '///////////////////////////// y = y_box pb.DrawWidth = 10 For i = 0 To UBound(colour_matrix) - 1 If (i Mod 10) = 0 Then x_box = x_box + 200 y_box = y End If colour_matrix(i, 3) = x_box colour_matrix(i, 4) = y_box pb.DrawPoint x_box, y_box, RGB(colour_matrix(i, 0), colour_matrix(i, 1), colour_matrix(i, 2)) y_box = y_box + 200 Next End Sub

The On_Click event on the legendry boxes is handled in the Sub pb_MouseDown(). When you click on any one of the legendry box, the data related to that sector is read from an array "info" and displayed in the "Text1" textbox. If you want to customize the data related to each sector you can append the details in this function as shown below.

Private Sub pb_MouseDown(ByVal Button As Long, ByVal Shift As Long, ByVal x As Double, ByVal y As Double) Dim i As Integer For i = 0 To UBound(colour_matrix) - 1 If x > colour_matrix(i, 3) - 75 And x < colour_matrix(i, 3) + 75 And y > colour_matrix(i, 4) - 75 And y < colour_matrix(i, 4) + 75 Then Text1.Text = Info(i) Exit For End If Next End Sub

I hope this article will be helpful to all those programmers who are searching for free tools to draw pie charts in eVB. If anyone is interested in understanding the logic behind, they can always contact me at Kosuri RajaSekhar.

Source code

You can download source code mentioned in this article - Source code (696 Kb).

Related resources: