Simple Pie Chart with Explode Features

JavaFX Dialogue started with “Rich Internet Application for an expressive world”. So, I tried to figure out what are the applications required for RIA. And finally I came with a small important apps called Pie Chart. We use Pie Chart to express data in visual form and it is commonly used by most of the internet sites. From this blog, we will learn how to make a Pie Chart. So, here is the look :

and here it is in exploded form:

A very simple application.

public class PieChart extends CustomNode {

   public var sAngle = 0.0;
   public var len: Number = 0.0;
   public var color = Color.RED;
   public var sArea = 1;
   public var xt = 0.0;
   public var yt = 0.0;

This is the class of PieChart. Depending on the number of arc. needed we can make instance of this classes and bind the attribute with proper data.

Explode feature is quite mathematical and written like :

xt =>  20 * Math.cos(2  *  Math.PI  *  (sAngle  +  len  /  2)  /  360)
                          tween Interpolator.LINEAR
yt => -20 * Math.sin(2  *  Math.PI  *  (sAngle  +  len  /  2)  /  360)
                          tween Interpolator.LINEAR

This is a standard math equation for finding the point on a circle. For one slice, we are finding the center point and move the slice according to the equations.

One more basic class is to handle the template of the application. It has simple drag equation on rectangular title bar and FX.exit() on close button. What else ? Nothing .

Launch the application here :