How to implement custom numeric formatting in HTML5(highcharts) bar chart

Question:

The values are being displayed as for ex: 40,000, but they should be displayed as 40K..M for million and so on.

Answer:

To implement this solution:

Enable javascript in iReport Designer:
click Tools->Options->JasperReports Properties
and add the property that I quote below:
```
com.jaspersoft.jasperreports.highcharts.function.properties.allowed
```
and set its value to true
Enable javascript in Jaspersoft Studio on Mac:
click Jaspersoft Studio Professional->Preferences
under section Jaspersoft Studio find Properties
and add this property:
```
com.jaspersoft.jasperreports.highcharts.function.properties.allowed
```
and set its value to true
OR
- Enable JavaScript in JasperReports Server:
  1. Add the property that I quote below to jasperserver-proWEB-INFclassesjasperreports.properties
```
com.jaspersoft.jasperreports.highcharts.function.properties.allowed=true
```
  2. Restart the application server to apply the changes that have been done
- Open your html5 report in iReport/JasperSoft Studio
- Right-click on the chart and select Edit Chart Properties->Show advanced properties
- Add property which I quote below:
```
plotOptions.series.dataLabels.formatter
```
- Select Use Expression
- As the expression for this property uses the custom JavaScript Function:
```
"function(){if (this.y > 1000000) {result = Math.floor(this.y / 1000000) + "M"}else if (this.y > 1000) {result = Math.floor(this.y / 1000) + "K"} return result;}"
```
  this function should be copied as one single string to the expression editor
- Save the report and execute it or upload to JasperReports Server
I have attached a sample of such report (jrxml and exported version) to the article for your convenience. The test report uses dummy sql and JserverJNDI data source and could be checked in your instance of JasperReports Server.

Best regards,
Alex