Integrating unsupported visualizations
Using the Custom Visualization report item you can integrate any third‑party visualization with BIRT reports. Examples of such libraries are FusionCharts, D3.js, Highcharts, and amCharts.
The integration process involves the following steps:
*Find a visualization that you like and locate its demo code.
There are many web sites that provide visualizations and demonstrate how the visualizations work by providing examples and sample code.
*Copy the demo code to a Custom Visualization editor template.
The online visualizations provide the code for integrating the components in customer applications. The code typically consists of libraries that you must load in your application and code that you must customize to integrate the components with your data and modify their appearance. The modifications can be done in JavaScript, HTML, or CSS, depending on each implementation.
*Enable preview from Web Viewer.
You can preview the example in BIRT Designer Web Viewer as a real environment, or JSFiddle as a simplified testing environment. To enable the example preview, you must load the required third‑party libraries. Use HeadJS to load the resource files.
*Define data bindings.
The Custom Visualization editor provides tools to define the data you want to use in the third‑party visualization. The data you select is a subset of the report data. You can additionally define grouping, sorting, filters, and aggregations on the bound data. In the template, you use JSAPI to transform and map the data to the required data format.