Implementing FusionCharts with the Struts 2 Framework

Apache Struts 2, earlier known as WebWork 2, is an extensible framework that allows developers to create enterprise-ready Java-based web applications. The Struts 2 framework has been designed in a way that helps to streamline the complete application development cycle—starting from building the application to deploying it to maintaining it over time.

FusionCharts Suite XT is a JavaScript charting library that comprises of a large variety of JavaScript charts that use simple XML and JSON formats to feed data for creating graphs that you can use in your demos.
The suite also comes with the capability to be coupled with several other frameworks for ease of development.

In this tutorial, we will be looking at implementing FusionCharts with one such framework—the Struts 2 framework.

So let’s get started!


To get the code (for creating charts) in this post working, we need to first download the following components on our local machine:

Creating the Application and Configuration

Step 1

Create a new web application project with the Struts2 framework.

Step 2

Create a java class that will act as a controller in the framework. The output of this will be an entire FusionCharts string that will be called in the jsp page (or the view). On running this string, the chart will be rendered.

Note : Include the file in the same folder in which you have created the above Java class. If you have placed the FusionCharts java wrapper inside a different package, import it into the folder with the Java class.

Step 3

Create a JSP page that will act as the view. The chart will render in the browser on executing this JSP page.

Note : Import the Fusioncharts wrapper in the JSP page and also include the FusionCharts JS library files in the page.

Viewing the Chart

Now, all you need to do is simply run the .jsp file to render the chart.

Your output should look like the chart shown below:

If you find any difficulty in rendering the chart or you see any error in your code, click here to download the complete source code of the sample project we have created for this tutorial.

Was There a Problem Rendering Charts?

In case something went wrong and you are unable to see the chart, check for the following:

  • The chart ID should be unique for all charts rendered on the same page. Otherwise, it will result in a JavaScript error.
  • If the chart does not show up at all, check if the fusioncharts.js and FusionCharts wrapper was loaded. Also, check if the path to the fusioncharts.js and the files is correct, and whether the files exist in that location.

Leave a Comment