This is a redefinition of Ext.chart.theme to allow customisation of gradients for Ext JS.

ext-chart-theme-fix.js

var NewThemeClass = function (config, base) {

    // Arguments
    config = Ext.apply({
        gradientAngle: 45,
        gradientDarkerRatio: 0.1
    }, config);

    var i = 0, l, colors, color,
    seriesThemes, markerThemes,
    seriesTheme, markerTheme,
    key, gradients = [],
    midColor, midL;

    if (config.baseColor) {
        midColor = Ext.draw.Color.fromString(config.baseColor);
        midL = midColor.getHSL()[2];
        if (midL < 0.15) {
            midColor = midColor.getLighter(0.3);
        } else if (midL < 0.3) {
            midColor = midColor.getLighter(0.15);
        } else if (midL > 0.85) {
            midColor = midColor.getDarker(0.3);
        } else if (midL > 0.7) {
            midColor = midColor.getDarker(0.15);
        }
        config.colors = [ midColor.getDarker(0.3).toString(),
        midColor.getDarker(0.15).toString(),
        midColor.toString(),
        midColor.getLighter(0.15).toString(),
        midColor.getLighter(0.3).toString()];

        delete config.baseColor;
    }
    if (config.colors) {
        colors = config.colors.slice();
        markerThemes = base.markerThemes;
        seriesThemes = base.seriesThemes;
        l = colors.length;
        base.colors = colors;
        for (; i < l; i++) {
            color = colors[i];
            markerTheme = markerThemes[i] || {};
            seriesTheme = seriesThemes[i] || {};
            markerTheme.fill = seriesTheme.fill = markerTheme.stroke = seriesTheme.stroke = color;
            markerThemes[i] = markerTheme;
            seriesThemes[i] = seriesTheme;
        }
        base.markerThemes = markerThemes.slice(0, l);
        base.seriesThemes = seriesThemes.slice(0, l);
        //the user is configuring something in particular (either markers, series or pie slices)
    }
    for (key in base) {
        if (key in config) {
            if (Ext.isObject(config[key]) && Ext.isObject(base[key])) {
                Ext.apply(base[key], config[key]);
            } else {
                base[key] = config[key];
            }
        }
    }
    if (config.useGradients) {
        colors = base.colors || (function () {
            var ans = [];
            for (i = 0, seriesThemes = base.seriesThemes, l = seriesThemes.length; i < l; i++) {
                ans.push(seriesThemes[i].fill || seriesThemes[i].stroke);
            }
            return ans;
        })();
        for (i = 0, l = colors.length; i < l; i++) {
            // Allows complete customisation of gradients
            if (config.gradientCallback) {
                config.grandientCallback(colors, gradients);
            } else {
                midColor = Ext.draw.Color.fromString(colors[i]);
                if (midColor) {
                    color = midColor.getDarker(config.gradientDarkerRatio).toString();
                    midColor = midColor.toString();
                    key = 'theme-' + midColor.substr(1) + '-' + color.substr(1);
                    gradients.push({
                        id: key,
                        angle: config.gradientAngle,
                        stops: {
                            0: {
                                color: midColor.toString()
                            },
                            100: {
                                color: color.toString()
                            }
                        }
                    });
                    colors[i] = 'url(#' + key + ')';
                }
            }
        }
        base.gradients = gradients;
        base.colors = colors;
    }
    
    /*
     base.axis = Ext.apply(base.axis || {}, config.axis || {});
     base.axisLabel = Ext.apply(base.axisLabel || {}, config.axisLabel || {});
     base.axisTitle = Ext.apply(base.axisTitle || {}, config.axisTitle || {});
     */

    Ext.apply(this, base);
};

// Copy the existing themes and other attributes out
for (var i in Ext.chart.theme) {
    NewThemeClass[i] = Ext.chart.theme[i];
}

// Replace the old class
Ext.chart.theme = NewThemeClass;