0

I am using ExtJS to render charts, but my column chart is getting with the same color for all series. I need different colors for the series. Only happens with column, bar and area charts, the line chart is working fine.

My code:

Ext.Ajax.request({
        method: 'get',
        url: Webapp.link('chart/' + key),
        success: function(response){
            var resposta = Ext.JSON.decode(response.responseText);
            var chart = Ext.create('Hemisphere.view.chart.Chart', {
                axes: resposta.chart.axes,
                series: resposta.chart.series,
                store: store (The store is defined previously)
            });
            panel.removeAll();
            panel.add(chart);
            }
        }
    });

Anyone could help me? Thanks. enter image description here

One serie code example.

enter image description here

enter image description here

Danilo M.
  • 1,422
  • 5
  • 17
  • 31

1 Answers1

1

You can change the color using a renderer on your series.

Ext documentation has a working example of this:

http://docs.sencha.com/ext-js/4-1/#!/example/charts/Column2.html

        series: [{
            type: 'column',
            renderer: function(sprite, storeItem, barAttr, i, store) {
                barAttr.fill = colors[i % colors.length];
                return barAttr;
            }
            .
            .
        }]
CD..
  • 72,281
  • 25
  • 154
  • 163
  • Yes, I did it, but the problem is other. I have one serie under other serie. There are 3 highlight can you see? I need the different colors for this series. Do you understand me?? I will post other image for you. – Danilo M. Mar 05 '13 at 16:49
  • All chart configuration, like axes, series are coming from my database, I just set the properties from my json response and mount the chart component. But I will post the code for you. – Danilo M. Mar 05 '13 at 16:58
  • 1
    can't really understand too much out of your code, but I've created a working example: http://jsfiddle.net/zMMMq/1/ – CD.. Mar 05 '13 at 17:09
  • What you did in jsfiddle is exactly what I wanted, thank so much! – Danilo M. Mar 05 '13 at 18:31