Working with the Sunburst ADF Component

JDeveloper 11.1.1.7 just hit the streets and among the new features it contains are several new data visualization ADF Faces components including timeline, treemap, and sunburst.

I got to play with the sunburst component a while back while building some internal demos - so I thought I'll provide a quick overview of some of the things you can do with it, and how to work with it at design time.

The sunburst component is used to visually show numerical data along one or two axises relating to something. One axis of data will show as the size of slices and the other data will show as a color. You can think about it as a two axis pie chart. The sunburst also allow for drilling into detail levels.

In the below example I'm showing just one set of data that has to do with the total orders broken in several levels - region->country->customer.

So here is the demo:

For those interested in the actual JSF code it is below:

          <dvt:sunburst id="s1" value="#{bindings.RegionSales1.treeModel}"
                        var="row" animationOnDataChange="alphaFade"
                        animationOnDisplay="fan" displayLevelsChildren="0"
                        styleClass="AFStretchWidth"
                        inlineStyle="height:620.0px;" legendSource="ag1"
                        colorLabel="Sales">
            <af:switcher facetName="#{row.hierTypeBinding.name}" id="s2">
              <f:facet name="RegionSales10">
                <dvt:sunburstNode value="#{row.Total}" label="#{row.Name}"
                                  id="sn3" drilling="insert">
                  <dvt:attributeGroups id="ag1" value="#{row.Total}"
                                       label="#{row.Total}" type="color"
                                       attributeType="continuous" minValue="0"
                                       maxValue="3000000" minLabel="0"
                                       maxLabel="3M">
                    <f:attribute name="color1" value="11AA55"/>
                    <f:attribute name="color2" value="44BB77"/>
                    <f:attribute name="color3" value="77DD99"/>
                  </dvt:attributeGroups>
                </dvt:sunburstNode>
              </f:facet>
              <f:facet name="RegionSales11">
                <dvt:sunburstNode value="#{row.Total}" label="#{row.Country}"
                                  id="sn1" drilling="insert">
                  <dvt:attributeGroups id="ag2" value="#{row.Total}"
                                       label="#{row.Total}" type="color"
                                       attributeType="continuous" minValue="0"
                                       maxValue="2800000" minLabel="0"
                                       maxLabel="2.8M">
                    <f:attribute name="color1" value="11AA55"/>
                    <f:attribute name="color2" value="44BB77"/>
                    <f:attribute name="color3" value="77DD99"/>
                  </dvt:attributeGroups>
                </dvt:sunburstNode>
              </f:facet>
              <f:facet name="RegionSales12">
                <dvt:sunburstNode value="#{row.Total}" label="#{row.Name1}"
                                  id="sn2" drilling="insertAndReplace"/>
              </f:facet>
            </af:switcher>
          </dvt:sunburst>



Comments:

Hello Shay,
I'm using Jdev 11.1.2.3. Are those new features available?

Posted by guest on April 01, 2013 at 02:19 PM PDT #

For people who are using 11.1.2.* these feature will be in the 12c version.

Posted by Shay on April 09, 2013 at 09:53 AM PDT #

Hello Shay.
can i get the project

Posted by guest on February 24, 2014 at 04:54 AM PST #

guest, I didn't keep a copy of this project - all the steps to re-create this are shown in the video. So just follow these and you'll basically have the project.

Posted by Shay Shmeltzer on February 27, 2014 at 10:24 AM PST #

Post a Comment:
  • HTML Syntax: NOT allowed
About

me
I'm a Director of Product Management for the Oracle Java Development Tools.
Follow me:
Search

Archives
« April 2014
SunMonTueWedThuFriSat
  
1
2
3
4
5
6
7
8
9
10
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
   
       
Today