A couple of weeks ago Oracle Jdeveloper and ADF team released new version of
Jdevloper 12.2.1 with many cool features
New funnel chart
(<dvt:funnelChart>) is introduced instead of funnel graph
(<dvt:funnelGraph>)
Old funnel graph looks like this-
Funnel chart is used to show visual distribution of different steps of any cycle
What docs says-
A chart representing data related to steps in a process. The steps
appear as vertical slices across a cone-shaped section which represent
stages of a procees or target and actual values, showing levels by
color.
Here we see how to use this new component to design a better UI, For this I have created a viewObject using this sql
SELECT A.DEPARTMENT_NAME,
B.FIRST_NAME ||' '|| B.LAST_NAME AS EMPLOYEE_NAME,
B.SALARY,
100000 AS TARGET
FROM DEPARTMENTS A, EMPLOYEES B
WHERE A.DEPARTMENT_ID=B.DEPARTMENT_ID;
Then go to datacontrol and drop this viewObject on page as chart
In dialog select Funnel on left panel and you can select horizontal or vertical layout of funnel at right side
This is the configuration screen for Funnel. Here we can select
Actual and
Target values and
Section Name appears on view port
Click on ok button of this dialog and your Funnel chart is ready
See generated XML-
<dvt:funnelChart id="funnelChart2" var="row" value="#{bindings.DeptEmpView11.collectionModel}">
<dvt:funnelDataItem id="di2" targetValue="#{row.Target}" label="#{row.DepartmentName}"
value="#{row.Salary}"/>
</dvt:funnelChart>
Now run this application and see how it appears :)
Wow.. it's good :)
If we want to show only Departments Name with salary (No comparison with Target) then just remove this
targetValue from xml code and then it looks like this
There are lots of properties to change it's layout , 3D effect , Title , FootNote etc. Try each one and see how it affects Funnel
Cheers :) Happy Learning
