In this article we will learn how to add a new chart to an Adhoc Chart List.
Chart list shows the list of chart available to the user while creating a chart report using Adhoc. Whenever we open an Adhoc report in edit mode, we can see the predefined charts in the list. If we want to add a new chart in that list then we have to update the charting libraries. On updating, the new chart is visible while creating a new chart report in Adhoc using Helical Insight.
Let us understand how to include a new charting library :
- We will need a JavaScript (JS) and CSS code of that required charting library
- The CSS file needs to be included in ‘/webapps/<application-name>/css‘ folder inside the tomcat folder with a .css extension.
- The JavaScript file needs to be included inside ‘/webapps/<application-name>/vendors/js‘ folder inside the tomcat folder with a .js extension.
- Path Set : After adding JS and CSS files of the charting library, its path needs to be set in the ‘/webapps/<application-name>/visualizeAdhoc.jsp‘ file, as shown below :
CSS Path :
Javascript (JS) Path :
Example :
Let us understand in Helical Insight how to add a Treemap Chart or any other chart in the Adhoc Chart List using following steps :
- View of Adhoc Chart List before addition of Treemap
2. Add a CSS file ‘HI-Treemap.css ‘ on server in ‘/hi-SNAPSHOT/css’ folder
3. Add ‘HI-extend-Treemap.js‘ file on server in ‘/hi-SNAPSHOT/js/vendors‘ folder
4. Include .css file path of Treemap in visualizeAdhoc.jsp file
5. Add .js file of Treemap included in visualizeAdhoc.jsp file
6. Treemap chart type assigned in chart-types.js file
7. Now, Treemap is added in the Adhoc chart list and can be used in adhoc. On generating the Treemap using adhoc is as shown below:
For More Info, Contact us at demo@helicalinsight.com