How to arrange a legend in 2 rows and 2 columns in Jasper studio

I have plotted a graph (HTML5 chart) between 4 measures.

  1. Sales A
  2. Profit A
  3. Sales B
  4. Profit B

But when I plot the HTML5 chart in Jasper studio, the legend of the graph is being displayed as

"Sales A Sales B Profit A "
"Profit B"

which means it is being displayed in 2 rows and 3 columns.

But I would like to see the legend as below

"Sales A   Sales B"
"Profit A  Profit B" 

That means I need legend should be arranged in 2 rows & 2 columns.

I have tried all possible ways by editing graph properties but did not get the solution.

How can I achieve this in Jasper graph?

Chandapremvardhan1995's picture
Joined: Apr 20 2021 - 11:33pm
Last seen: 3 months 3 weeks ago

Thank you for posting to the Jaspersoft Community. Our team of experts has read your question and we are working to get you an answer as quickly as we can. If you have a Jaspersoft Professional Subscription plan, please visit for direct access to our technical support teams offering guaranteed response times.

arai_4 - 4 months 5 days ago

1 Answer:

There are a lot of possible options to adjust the legend settings. Generally, I recommend checking the Highcharts API (the underlying functionality of our HTML5 Charts) for details and fiddle samples; specifically for legends:

I would look at itemWidth ( and see if adjusting that number helps out. If you get the behavior you want in the fiddle, simply transfer the exact property over to our Advanced Properties settings in the HTML5 Charts Properties. There are other settings that may affect the look and feel per your requirements.

I hope this helps!

mbielkiewicz's picture
Joined: Feb 23 2014 - 9:22pm
Last seen: 6 days 8 hours ago