JavaFX Pie Chart Demo: A Taste of Charts/Graphs Coming to the JFXtras Project

Update June 1, 2009: JavaFX 1.2 and later has charting functionality.  See this post for details.

As I mentioned in the JFXtras: Utilities and Add-ons for the JavaFX Language post, JFXtras is an open-source project that helps fill in some of the gaps of the JavaFX 1.0 Release.  There are several JavaFX developers actively creating functionality for this project, and Ben S. Jones, Director of Research & Development at The Standards Company is one of these developers.  Ben has taken on the task of implementing charting and graphing capabilities in the JFXtras libraries so that any JavaFX program can easily create charts and graphs.  He is currently working on a JavaFX implementation of a pie chart and has created a program, shown below, that demonstrates some of its features:

By the way, the graphical button in the upper right corner of the application shows and hides the Wedge Properties dialog shown above.  Take the program for a spin by clicking on the Java Web Start Launch link above, and then read the brief explanation that follows, also written by Ben:

Bound in the Middle

"Given the trends in information interaction, application developers must reach beyond simply displaying information and engage users with rich data explorations. JavaFX addresses this shift in application development with a powerful set of features for manipulating the relationship between data and presentation. Of immediate benefit to developers is the ability to leverage that relationship to quickly build rich interfaces where users interact with data in meaningful ways.

As an example of this ability, the pie chart demo takes advantage of dynamic binding relationships between data and presentation by means of a simple interactive interface. Users add or remove wedges, change the size, color, and label of a wedge, as well as alter other chart level visuals. While simple in scope, it points to the growing blur between traditional models of data production and consumption and the emerging user expectation for information mashups.

For example, the techniques used in the demo to control the various aspect of the chart work equally well in the creation, modification, and re-conceptualization of the data. Starting with a simple sequence of Numbers to hold explode values for each wedge, a slider control dynamically manipulates elements in that sequence resulting in various wedges pulling in or out from the center of the chart. Let's take a quick look at how this can be coded, starting with the sequence holding the explode values:

public var explodes:Number[];

and then the slider manipulating those values:

SwingSlider {
  translateX:100
  translateY:50
  minimum: 0
  maximum: radius / 5 as Integer
  value: bind explodeValue with inverse
  vertical: false
  width:100
}

Notice that we did not bind the slider value to the explodes sequence directly. There are two reasons:

1. explodes is a sequence of Number, not a single Integer as required by the SwingSlider value
2. We want to manipulate specific elements in the sequence individually

This is where explodeValue comes into play. This intermediate bind value is extremely useful allowing a bi-directional flow of values between the slider and the explodes sequence. It also affords an opportunity to target specific wedges with these changing values. By defining explodeValue as follows:

var explodeValue:Integer on replace {
  explodes[activeWedge] = explodeValue as Number;
};

we can link the current slider value to a specific wedge through the activeWedge index. In the case of the demo, activeWedge is set when a particular wedge has been clicked upon with the mouse. It could just as easily been set by some other action or changing data source. The wedge then explodes outward from the chart center or back inward depending on the value."

Thanks for this, Ben, and I look forward to seeing charting and graphing capabilities added to the JFXtras project!

By the way, if you are interested in using, or developing code for, the JFXtras project, please check it out!

Thanks,
Jim Weaver
JavaFXpert.com

Comments

[Ben]

Alberto,

This appears to occur occasionally on Vista systems. I'm looking into some modifications that should cure this issue. Thanks for your alert on the problem.

[Alberto]

when I try to launch it I receive the following error (I have windows vista and Java 6 update 12):

com.sun.deploy.net.FailedDownloadException: Unable to load resource: http://javafx.standardsco.com/demos/piechart2d/Piechart2d.jar
at com.sun.deploy.net.DownloadEngine.actionDownload(Unknown Source)
at com.sun.deploy.net.DownloadEngine.getCacheEntry(Unknown Source)
at com.sun.deploy.net.DownloadEngine.getCacheEntry(Unknown Source)
at com.sun.deploy.net.DownloadEngine.getResourceCacheEntry(Unknown Source)
at com.sun.deploy.net.DownloadEngine.getResourceCacheEntry(Unknown Source)
at com.sun.deploy.net.DownloadEngine.getResource(Unknown Source)
at com.sun.javaws.LaunchDownload.downloadJarFiles(Unknown Source)
at com.sun.javaws.LaunchDownload.downloadEagerorAll(Unknown Source)
at com.sun.javaws.Launcher.downloadResources(Unknown Source)
at com.sun.javaws.Launcher.prepareLaunchFile(Unknown Source)
at com.sun.javaws.Launcher.prepareToLaunch(Unknown Source)
at com.sun.javaws.Launcher.launch(Unknown Source)
at com.sun.javaws.Main.launchApp(Unknown Source)
at com.sun.javaws.Main.continueInSecureThread(Unknown Source)
at com.sun.javaws.Main$1.run(Unknown Source)
at java.lang.Thread.run(Unknown Source)

[Jim Weaver]

"Would it be possible to publish the source code for this pie chart applet, Jim?"

It will be added at some point to the open source JFXtras project:
http://code.google.com/p/jfxtras/
Ben Jones is the developer working on charting/graphing, so you could join the project and ask him to see the source code.

Thanks,
Jim Weaver

[Tommy]

Jim, no, I'm too occupied with my current project the next 10 weeks.

Would it be possible to publish the source code for this pie chart applet, Jim?

Regards, Tommy

[Thierry]

I also have all these character exceptions.
I run a normal powerfull windows XP PC.

Exception in binding:
com.sun.javafx.scene.shape.svgpath.parser.ParseException: character.unexpected
at com.sun.javafx.scene.shape.svgpath.parser.AbstractParser.reportError(Unknown Source)
at com.sun.javafx.scene.shape.svgpath.parser.AbstractParser.reportUnexpectedCharacterError(Unknown Source)
at com.sun.javafx.scene.shape.svgpath.parser.NumberParser.parseFloat(Unknown Source)
at com.sun.javafx.scene.shape.svgpath.parser.PathParser.parsea(Unknown Source)
at com.sun.javafx.scene.shape.svgpath.parser.PathParser.doParse(Unknown Source)
at com.sun.javafx.scene.shape.svgpath.parser.AbstractParser.parse(Unknown Source)

[Jim Weaver]

"Yup, indeed it is due to the regional settings. I changed Mac OS X into English and logged in and ran it. Worked just fine.

Note that it failed to work on my work computer that runs Windows XP with jdk 1.6u11 and my Windows account uses Swedish regional settings but Windows itself is us-eng if I remember correctly."

Tommy,

Would you mind narrowing this down to a test case that can be submitted to the JavaFX compiler team? Also, are you going to be at Jfokus later this month?

Thanks,
Jim Weaver

[Tommy]

Yup, indeed it is due to the regional settings. I changed Mac OS X into English and logged in and ran it. Worked just fine.

Note that it failed to work on my work computer that runs Windows XP with jdk 1.6u11 and my Windows account uses Swedish regional settings but Windows itself is us-eng if I remember correctly.

[Tommy]

I forgot to mention I got loads more exceptions, but pasting it in here proved difficult due to size and spam restrictions.

[Tommy]

Hi again Jim!

Looks like it could be related to character encoding. I live in Sweden.

Regards, Tommy

Java Web Start 1.6.0_07
Använder JRE-version 1.6.0_07 Java HotSpot(TM) 64-Bit Server VM
Användarens hemkatalog = /Users/tommy
----------------------------------------------------
c: töm konsolfönstret
f: slutför objekt i slutföringskö
g: skräpinsamling
h: visa det här hjälpmeddelandet
m: skriv ut minnesanvändning
o: utlösarloggning
p: läs in proxykonfiguration igen
q: göm konsol
r: läs in policykonfiguration igen
s: dumpa system- och distributionsegenskaper
t: dumpa trådlista
v: dumpa trådstack
0-5: ange spårningsnivå till
----------------------------------------------------
Exception in binding:
com.sun.javafx.scene.shape.svgpath.parser.ParseException: character.unexpected
at com.sun.javafx.scene.shape.svgpath.parser.AbstractParser.reportError(Unknown Source)
at com.sun.javafx.scene.shape.svgpath.parser.AbstractParser.reportUnexpectedCharacterError(Unknown Source)
at com.sun.javafx.scene.shape.svgpath.parser.NumberParser.parseFloat(Unknown Source)
at com.sun.javafx.scene.shape.svgpath.parser.PathParser.parsea(Unknown Source)
at com.sun.javafx.scene.shape.svgpath.parser.PathParser.doParse(Unknown Source)
at com.sun.javafx.scene.shape.svgpath.parser.AbstractParser.parse(Unknown Source)
at com.sun.javafx.scene.shape.svgpath.parser.AWTPathProducer.createPath(Unknown Source)
at javafx.scene.shape.SVGPath.updateSVGPath$impl(Unknown Source)
at javafx.scene.shape.SVGPath.updateSVGPath(Unknown Source)
at javafx.scene.shape.SVGPath.userInit$(Unknown Source)
at javafx.scene.shape.SVGPath.initialize$(Unknown Source)
at org.jfxtras.chart.piechart2d.PieWedge2D.create$impl(PieWedge2D.fx:100)
at org.jfxtras.chart.piechart2d.PieWedge2D.create(PieWedge2D.fx:37)
at javafx.scene.CustomNode.postInit$(Unknown Source)
at org.jfxtras.chart.piechart2d.PieWedge2D.postInit$(PieWedge2D.fx:37)
at org.jfxtras.chart.piechart2d.PieWedge2D.initialize$(PieWedge2D.fx:37)
at org.jfxtras.chart.piechart2d.PieChart2D$2$1.computeValue(PieChart2D.fx:139)
at org.jfxtras.chart.piechart2d.PieChart2D$2$1.computeValue(PieChart2D.fx:139)
at com.sun.javafx.runtime.location.ObjectVariable.update(Unknown Source)
at com.sun.javafx.runtime.location.AbstractVariable.bind(Unknown Source)
at com.sun.javafx.runtime.location.ObjectVariable.(Unknown Source)
at com.sun.javafx.runtime.location.ObjectVariable.make(Unknown Source)
at org.jfxtras.chart.piechart2d.PieChart2D$2.computeElements$(PieChart2D.fx:138)
at org.jfxtras.chart.piechart2d.PieChart2D$2.computeElements$(PieChart2D.fx:138)
at com.sun.javafx.runtime.sequence.AbstractBoundComprehension.makeState(Unknown Source)
at com.sun.javafx.runtime.sequence.AbstractBoundComprehension.fillInNewValues(Unknown Source)
at com.sun.javafx.runtime.sequence.AbstractBoundComprehension.computeValue(Unknown Source)
at com.sun.javafx.runtime.sequence.AbstractBoundComprehension.(Unknown Source)
at com.sun.javafx.runtime.sequence.IntBoundComprehension.(Unknown Source)
at org.jfxtras.chart.piechart2d.PieChart2D$2.(PieChart2D.fx:138)
at org.jfxtras.chart.piechart2d.PieChart2D.create$impl(PieChart2D.fx:137)
at org.jfxtras.chart.piechart2d.PieChart2D.create(PieChart2D.fx:37)
at javafx.scene.CustomNode.postInit$(Unknown Source)
at org.jfxtras.chart.piechart2d.PieChart2D.postInit$(PieChart2D.fx:37)
at org.jfxtras.chart.piechart2d.PieChart2D.initialize$(PieChart2D.fx:37)
at org.jfxtras.chart.piechart2d.Main.javafx$run$(Main.fx:171)
at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
at sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:39)
at sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:25)
at java.lang.reflect.Method.invoke(Method.java:597)
at com.sun.javafx.runtime.provider.AWT_EDT_RuntimeProvider$1.run(Unknown Source)
at java.awt.event.InvocationEvent.dispatch(InvocationEvent.java:209)
at java.awt.EventQueue.dispatchEvent(EventQueue.java:597)
at java.awt.EventDispatchThread.pumpOneEventForFilters(EventDispatchThread.java:300)
at java.awt.EventDispatchThread.pumpEventsForFilter(EventDispatchThread.java:210)
at java.awt.EventDispatchThread.pumpEventsForHierarchy(EventDispatchThread.java:200)
at java.awt.EventDispatchThread.pumpEvents(EventDispatchThread.java:195)
at java.awt.EventDispatchThread.pumpEvents(EventDispatchThread.java:187)
at java.awt.EventDispatchThread.run(EventDispatchThread.java:121)

[Jim Weaver]

"This looks very promising, (and pretty). When this is complete I suspect the rotation slider, float-over details, click-expander etc. can all bet set or exposed as methods for automated rotation, onClick expansion/callbacks etc?

Very nice looking, looking forward to using this as part of my JavaFX experiments.

While we're on the subject, are there thoughts of also creating some GRIDS as a part of this JavaFX Extras library?"

Mike,
I suggest that you get involved in the JFXtras project at http://code.google.com/p/jfxtras/ and work with Ben Jones in defining and developing the charts and graphs that are most important. Regarding grids, Ben is looking at developing a grid that is bound to data.

Thanks,
Jim Weaver

[MikeE]

this is really cool. I'm experimenting with JavaFX on an "executive dashboard" (which is a "target application" per the JavaFX announcement information) but ran into a serious roadblock when realizing JavaFX didn't contain the required charting widgets..... (yep, thats a problem :-)

I started down a path of trying to wrap jfreechart somehow, but thats not going nearly as well as I had hoped...

This looks very promising, (and pretty). When this is complete I suspect the rotation slider, float-over details, click-expander etc. can all bet set or exposed as methods for automated rotation, onClick expansion/callbacks etc?

Very nice looking, looking forward to using this as part of my JavaFX experiments.

--

While we're on the subject, are there thoughts of also creating some GRIDS as a part of this JavaFX Extras library?

Something as fresh & nice-looking as:
http://www.extjs.com/deploy/dev/examples/grid/xml-grid.html

Or should we use SWING grids for things like this instead? (the SWING grids I've seen don't look quite as good though, and appear in need of a bit of a refresh....)

thanks,

-- MikeE

[Jim Weaver]

"I've tried this web start app above on both Win XP with jdk 1.6u11 and on Mac OS X with Java6. On neither there's a pie chart showing up. Any ideas?"

Tommy,

Can you copy the Java console from both machines, along with the hardware/OS specs for both? Thanks!

Jim Weaver

[Tommy]

Hi Jim!

I've tried this web start app above on both Win XP with jdk 1.6u11 and on Mac OS X with Java6. On neither there's a pie chart showing up. Any ideas?