Use JSP to generate a pie chart

Author: Builder. com

JSP provides many simple and practical tools, including reading data from the database, sending data, and displaying the results in a pie chart. Now let's take a look at this simple and practical method.

What you need

Transfer from: dynamic network Production Guide www.knowsky.com

In order to run this item correctlyArticleFor related examples, you must require JDK 1.2 or later, a relational database management system, and a JSP network server. I debug these examples in Tomcat, and I also use com.sun.image.codec.jpeg classes of Sun Java 2 sdkmodules.

Database Design
Suppose you work in a company that sells fresh fruits. The fruits sold by the company include Apple, orange, and grape. Now, your boss wants to use a pie chart to display the total sales volume of each fruit. The pie chart can display the sales status of each product at a glance, and the boss can quickly grasp the company's product transactions.

Table A uses the list of two databases in this article. The first type of list (products) contains the names of all sales products; the second type of list (sales) contains the sales volume of each product.

The product list contains two domains: productid and productname. The sales list includes saleid, productid, and total amount. Productid in the sales list provides associations between the two lists. The total amount in the sales list contains the amount of cash for each sale, which appears in floating point data.

Transfer from: dynamic network Production Guide www.knowsky.com

The getproducts () method in Table B connects two databases and stores all product names in an array. I set the following Database Rules:

Productid is the most unique and key in the product list;
Productid has a value of 0 for the first record;
All subsequent continuous records are accumulated, so the productid of the second record is 1, The productid of the third record is 2, and so on.
These Database Rules allow data to be stored in the product array as follows:

Arr [RS. getint ("productid")] = Rs. getstring ("productname ");

Some database management systems allow automatic data accumulation or sorting by default. When designing a database, you must first identify the rules that your database management system follows, such as automatic accumulation and automatic sorting.

Obtain the total sales volume

In most cases, there are many records in the sales list, so it is very important to access the database quickly and efficiently. Now we only need to access the total sales volume of each product in the database.

The getsales () method in Table C connects to the database and returns an array containing the total sales volume of each product. After getsales () traverses all records, it only stores the new sales volume of each product:

Transfer from: dynamic network Production Guide www.knowsky.com

Int Product = Rs. getint ("productid ");
Arr [product] + = Rs. getfloat ("amount ");

Piecolor object
Each product on the pie chart should be displayed in different colors. To achieve this goal, we create a piecolor object, as shown in table D. This object contains an array of colors:

Color piecolorarray [] = {new color (60,210, 60, 60), new color (, 60 )...}

The piecolor class defines a setnewcolor () method, which enables curpiecolor and index to increase progressively. At the same time, it can check that the index does not exceed the boundary range, that is, the method used is: if the value of curpiecolor is too large, 0 is assigned.

More effectively, after setnewcolor () loops each color, execute the following in the first color:Code:

Curpiecolor ++;
If (curpiecolor> = piecolorarray. length)
{Curpiecolor = 0 ;}

Renderinghints and antialiasing classes
The Java. AWT. renderinghints class defines many methods to display 2D graphs, including alpha_interpolation, jitter, and antialiasing methods. Renderinghints helps determine how a graph is displayed and how it is best handled.

Transfer from: dynamic network Production Guide www.knowsky.com

To achieve smooth display, you can use the Antialiasing method to process pie charts. Antialiasing is a smooth processing method for images. ItsAlgorithmIs to select a special pixel color value and replace the pixel at the intersection, so that the line intersection can be smoothed.

Figure A illustrates the effects of the Antialiasing method. We can see that the line intersection of the pie chart using the Antialiasing method becomes smooth.

Figure

Transfer from: dynamic network Production Guide www.knowsky.com

You can also create a renderinghints object and pass it to graphics2d setrenderinghints () method, as shown below:

Renderinghints renderhints = new renderinghints (renderinghints. key_antialiasing,
Renderinghints. value_antialias_on );
G2d. setrenderinghints (renderhints );

Making adjustable boundaries

In Figure A, a pie chart has a boundary. How can we change the boundary size? You can first define int border = 10, and then calculate the size of the area within the boundary to achieve the following:

Ellipse2d. Double ELB = new ellipse2d. Double (x_pie-border/2, y_pie-border/2, piewidth + border, pieheight + border );

The x_pie and y_pie values represent the upper left corner of the square surrounding the pie chart. We get the center of the pie chart by taking half of the boundary area (border/2.

Arc Theory
The fillarc () method inherited from the java. AWT. graphics class provides an easy way to draw all parts (or arcs) of a pie chart:

G2d. fillarc (x_position, y_position, width, height, startangle, sweepangle );

X_position, and y_position integers represent the coordinates of x and y in the upper-left corner of the arc to be filled. The width and heigh integers represent the specific size of the arc. If the width and height values are equal, the pie chart is a circle. If the width and height are not equal, the pie chart is an elliptic.

The fillarc () method determines the arc Size Based on the sweepangle integer. If the sweepangle value is positive, the arc is drawn in the clockwise direction.

Draw an arc
Step 1: Use the getpiecolor () method of the piecolor object to obtain the color of the nearest pie arc and assign it to the current arc ::

G2d. setcolor (PC. getpiecolor ());

Then, the total sales volume is obtained by continuously looping the sales [] array and accumulating it:

Salestotal + = Sales [I];

Using the total sales volume, you can calculate the percentage of sales of each product to the total sales volume:

Float Perc = (sales [I]/salestotal );

After calculating the sweepangle, we can allocate degrees to each part of the arc:

Int sweepangle = (INT) (PERC * 360 );

After each part of the arc is drawn, startangle increases progressively according to the current sweepangle. This ensures that the current arc is the beginning of the preceding arc to create a complete pie chart.

Show icon
The icon provides the most concise way to display all parts of a pie chart. The size of an icon should correspond to the possession in the pie chart.

Figure B shows a complete pie chart and its corresponding icons, including the product name, total sales volume, and the quantity of each part.

Figure B

Summary

This article describes how to use JSP to draw pie charts and algorithms. These methods and algorithms are simple and practical and can be fully utilized by developers.