Doughnut Chart - a Yummy Addition to Oracle ADF Faces

Another new feature in Oracle ADF 12.2.1 is the new Doughnut Chart capability.

It looks like this:

When I first tried to create this one, I couldn't find the option for doughnut chart in the JDeveloper wizard.

Then I was told that a doughnut is just a pie with a hole in the center - so you actually just need to create a pie chart, and then specify some properties.

And indeed, if you'll look at the property inspector for pie charts you'll see a few new properties you can leverage. 

For example there is the InnerRadius property - that expects a value between 1 and 0 - this controls how big is the hole in your doughnut.

Another nice capability is the you can put some filling in your doughnut - basically put some text that will go in the middle empty area. You do this by using centerLabel property. In the example above I used the center of the doughnut to report the total salary of a department - using a groovy sum expression in the Departments ViewObject - learn how here.

(Don't forget to use the centerLabelStyle property to assign it a bigger font - a best practice from the Oracle Alta UI book).

Here is the code from the JSF page:

<dvt:pieChart selectionListener="#{bindings.EmployeesView4.collectionModel.makeCurrent}"
   dataSelection="single" id="pieChart1" var="row"
   value="#{bindings.EmployeesView4.collectionModel}"
   centerLabel="Total Salary: #{bindings.SumSalary.inputValue}" innerRadius="0.7"
   centerLabelStyle="font-size:large;" title="Salary BreakDown"
   sliceLabelPosition="inside"><dvt:chartLegend id="cl1" position="bottom"/><dvt:pieDataItem id="di1" label="#{row.LastName}" value="#{row.Salary}"/></dvt:pieChart>

Try it out - it's a yummy new addition to Oracle's set of bakery based charts.