Before we drive into integration of jaspersoft and d3.js visualization and finally Running Jaspersoft Report within CA PPM Object, let me answer some questions popping up in our minds like what is D3.js? or Do we have any examples related to D3 visualization? or what are possible ways for achieving these? So, let's start with learning about D3.js with its visualizations.
D3.js (or just D3 for Data-Driven Documents)
D3 allows you to bind arbitrary data to a Document Object Model (DOM), and then apply data-driven transformations to the document. For example, you can use D3 to generate an HTML table from an array of numbers. Or, use the same data to create an interactive SVG bar chart with smooth transitions and interaction.
D3 is not a monolithic framework that seeks to provide every conceivable feature. Instead, D3 solves the crux of the problem: efficient manipulation of documents based on data. This avoids proprietary representation and affords extraordinary flexibility, exposing the full capabilities of web standards such as HTML, SVG, and CSS. With minimal overhead, D3 is extremely fast, supporting large datasets and dynamic behaviors for interaction and animation. D3’s functional style allows code reuse through a diverse collection of official and community-developed modules.
There are number of D3.js visualizations, however I have picked few from these.
Now, imagine these visualizations in jaspersoft reports when you are trying to make some powerful decision making Dashboards. They can provide a better visualization as compared to traditional charts. So, let's explore how can we see jasper reporting and D3.js working together to give our data more meaningful clay to make your decision brick.
1) Calling Jasper Report and D3.js in CA PPM HTML Portlet
We can use CA PPM html portlet for calling Jasper report and its component by using its integration methods are:
2) Using HTML element from jasper palette
Working with this apporach need a bit of work around, as html component of jasper server has some limitation, however a powerful way for creating html content with some scripting allowed. Due to a lot of limitations and issues while integration this one is least preferred.
3) Using CVC element from jasper palette
I have used CVC approach and have come up with below visualization for Project Hierarchy
1) Interactive Tree Hierarchy
2) Zoomable Icicle Report
now expanding icicle
I will try to answer How to use CVC component of Jaspersoft in upcoming blog, meanwhile please share your feedback on D3.js visualization and type of visualization which you think can improve CA PPM analytic ability.