ADF Tutorial: How to drill down a graph

It has been long time since our last post. Fortunately we have been quite busy. For this post, we have decided to show you how to implement a “drillable” graph.

Although documentation is out there, we couldn’t find a proper tutorial for this task, which mean that it could possible save you some time doing the proper research.

Key Fact: At difference of what you might have originally thought, the drillable functionality doesn’t depend on Master-Detail relationships between view objects (when your model is using ADF BC). Instead, it will look into one viewObject and from there, the functionality is implemented by the graph component according to the bindings definition configuration.

Key Fact #2: Don’t try to implement this solution using, for example, a PieChart graph. It won’t work. We are not sure why it won’t work so hopefully someone that reads this article will help us and point us to the answer.

We will explain you step by step so you can actually understand what is going on rather than just copying and pasting some random code into your application. Example will be based on Departments and Employees from HR Schema.

We are using JDeveloper 12.c but this should work in previous version as well. Please let know if it does not. So lets start by dragging and dropping the EmployeesVO from the DataControl into our page and selecting as the Bars type.


Now we logically want the bars to represent the salary and the department to be shown in the X axis:


If we run the application now, this is what we are going to get. It is basically all salaries for employees in all the departments:


Having a look to the page definition we see the following:


Now, we want to group by departments (agregateDuplicates) and we want the salary to be SUMMED (defaultAgregateType)


After we apply the changes and we re run the application, we can see now that salaries are summed and grouped by departments


Now, we want to drill down by department. So for this, we need to go again to the graph’s page definition and specify how the hierarchy is supposed to work. We need to specify what is the drillable item (item) and what are we going to show after the drill is done (child). Also, we need to tell that the graph will be replace when drilling.


And last thing to do is to indicate that the graph is drillingEnabled.


After all is done, this is what we get by running the application:


If we select department 80 we drill down:


Great! Now, what can we do to improve the presentation and the user experience? Two things:

1.- Show a multicolored graph rather than just one colour for the bars. Simple, just go to the page definition file (not the source code) and edit the graph, click Swap Bars With  and save your change.


After running the application you will see:


Drilling down:


2.- As you can imagine, displaying the DeparmentId  is not a real use case. So in order to show the department name you could do the following. You need to create a ViewCriteria for DepartmentVO based on DepartmentId.


Now, you need to add a view accessor to DepartmentsVO in the EmployeesVO. You can rename it EmpDepartment for example.


Edit it and apply the ViewCriteria and add the binding variable value to be DepartmentId.


Add the transient attribute DepartmentName and base it on a groovy expression as follows:


In the view controller project, go to the source code of the graph’s page definition and replace DepartmentId with DepartmentName.


This should be enough. Run your application and you are done:



We are currently working into an alternative way to ‘drillDown’ graphs. This approach won’t be using standard graph functionality but taskflow navigation instead.


  1. lev



    very nice tutorial. I’m quite new to ADF, so this helped me very much. If i want to drill down another level like: total revenue -> departments -> employees. How could I do that?

    • oralution



      Hi Lev. Thanks for your comment. At this stage we are doing some research about it and we will post if we found relevant information about how to achieve that. In the meanwhile you can post a question in the OTN JDeveloper and ADF Forums provinding this article and asking how to do the 2 levels drilldown. Maybe someone from oracle will help you out.


    • Adam



      This was an excellent tutorial that saved me about a weeks worth of work. In implementing it and playing some more with it I found an answer to your question Lev. First make sure that all of the levels that you what are included in the view object that you are using. So you will want revenue, departments and employees all included. Then follow the tutorial above. The only change you need to make is in the hierarchies tag. For example

      This will allow you to click on revenue and drill down to departments, then click on departments and drill down to employees. You can also add other hierarchies using the value sets in the series as well. This will allow you to drill into the items along the x-axis and also the items in the series legend. Hope this was helpful.

      • Adam



        Sorry the code was removed from my previous comment. I will write the code again with out the grater than or less then
        item value=”revenue”
        child value=”departments”
        item value=”departments”
        child value=”employees”

  2. Krishna Kumar R



    This is a nice article, in one of other blogs you have commented that the chart components introduced since 12.1.3 does not include the drill feature, is there a work around available that you are aware of?
    Please share your thoughts, it would be helpful for me.

Leave a comment

Your email address will not be published.

Social Media

Stay up-to-date with our latest ADF and related technical posts via your favourite social network services.