Add Plot Lines to your Chart

Creating plot lines in your charts requires a little bit of JavaScript, but don't worry. All you have to do is copy and paste the JavaScript code, and enter a few simple values.

But first, you have to enable a property in Jaspersoft Studio in order to allow JavaScript functions.

Set JSS Property

Open JSS and go to “Properties” or “Preferences”. On a Mac, it’s “Preferences”, but on a PC, it might be “Properties”. I think it’s under the “Window” menu on a PC.

Once you have the Properties/Preferences window open:

1. Unfold the Jaspersoft Studio Section

2. Select “Properties”

3. Click “Add:

4. Paste in the following for “Property Name”: com.jaspersoft.jasperreports.highcharts.function.properties.allowed

5. Set the value to: true

Add Plot Line to HTML5 Chart

Now, to add a plot line to your chart:

• Double-click on your chart

• Click Show Advanced Properties

• Click Add

• Set the Property name to: xAxis.plotLines

• Copy & Paste the code below into the Property value field:

(function(){return [{value: 2,width: 5,color: 'black'}]})()

• Now, adjust the values in the code to your liking.

  • The "value" will determine where the plot line appears on the axis.

  • The width & color are self explanatory 😀

• You can do the exact same thing for the yAxis. The only difference will be the Property name will be: yAxis.plotLines