How to Modify JasperReports Server 5.6.1 Default HTML5 Chart Color Palette

Question:

How can we modify the default color palette used by the HTML5 charts in JasperReports Server 5.6.1 Ad Hoc Views?

Answer:

The place to change default chart color palette for JasperReports Server v5.6.1 is defaultPalette.js file under deployed jasperserver-proscriptsadhocchartpalette directory.

However, JavaScript files have been optimized to improve performance in JasperReports Server v5.6.x. If making customizations to any JavaScript files, users need to download the optimization tools and use it to optimize the modified script files to make it take effect in JasperReports Server v5.6.x. This process is discussed in JasperReports Server Ultimate Guide version 5.6, section 9.2.3 "Customizing JavaScript Files".

The following is a modified defaultPalette.js file using rainbow color pattern for HTM5 charts display in JasperReports Server v5.6.1.

/*
* Copyright (C) 2005 - 2014 TIBCO Software Inc. All rights reserved.
* http://www.jaspersoft.com.
* Licensed under commercial Jaspersoft Subscription License Agreement
*/

/**
* @author: Igor Nesterenko
* @version: ${Id}
*/

//TODO: remove non-Amd wrapper after providing AMD support on server-side (chart export)
(function (factory, globalScope) {
    "use strict";

    if (typeof define === "function" && define.amd) {
        define(factory);
    } else {
        // Browser globals.
        globalScope.hcDefaultPalette = factory();
    }
}(function () {
    "use strict";

    return {

        colors: [
'#FF0000',
'#FF2100',
'#FF4200',
'#FF6300',
'#FF8400',
'#FFA500',
'#FFC600',
'#FFE700',
'#FFff00',
'#DEff00',
'#BDff00',
'#9Cff00',
'#7Bff00',
'#5Aff00',
'#39ff00',
'#18ff00',
'#00ff00',
'#00ff21',
'#00ff42',
'#00ff63',
'#00ff84',
'#00ffA5',
'#00ffC6',
'#00ffE7',
'#00ffff',
'#00E7ff',
'#00C6ff',
'#00A5ff',
'#0084ff',
'#0063ff',
'#0042ff',
'#0021ff',
'#0000ff',
'#1800ff',
'#3900ff',
'#5A00ff',
'#7B00ff',
'#9C00ff',
'#BD00ff',
'#DE00ff',
'#FF00ff',
'#FF00E7',
'#FF00C6',
'#FF00A5',
'#FF0084',
'#FF0063',
'#FF0042'
        ],

        rgbColors: [
            [13,35,58],
            [47,126,216],
            [145,0,0],
            [139,188,33],
            [73,41,112],
            [255,127,39],
            [255,201,14],
            [26,173,206],
            [196,37,37],
            [21,131,73],
            [119,161,229],
            [196,0,98],
            [219,170,0],
            [69, 114, 167],
            [170, 70, 67],
            [137, 165, 78],
            [128, 105, 155],
            [116,70,46],
            [192,60,3],
            [181,140,0]
        ]

    };
}, this));

After generating the optimized scripts with this change, user will be able to see charts color pattern change in Ad Hoc View Report.

Before change: