1. #1
    Sencha User
    Join Date
    Nov 2008
    Posts
    24
    Vote Rating
    0
    manoj123 is on a distinguished road

      0  

    Default PieChart colouring

    PieChart colouring


    I have a tabbed panel with a piechart inside each panel. Piechart in the first tab is displaying fine but rest of them do not have colours. Have attached pictures of correctly displayed and incorrectly displayed piechart snapshots.

    Please let me know if you want to see the code for the piechart.

    thank you
    good.pngnotgood.png

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,085
    Vote Rating
    467
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    Please provide a small working test case that we can use to duplicate.

    Scott.
    Last edited by scottmartin; 24 Sep 2012 at 9:23 AM. Reason: Incorrect answer, different issue.

  3. #3
    Sencha User
    Join Date
    Nov 2008
    Posts
    24
    Vote Rating
    0
    manoj123 is on a distinguished road

      0  

    Default


    Thanks for looking. Below is my simplified code using local store.

    Code:
    Ext.onReady(function () {
        
        var generateData = function(n, floor){
            var data = [],
                p = (Math.random() *  11) + 1,
                i;
                
            floor = (!floor && floor !== 0)? 20 : floor;
            
            for (i = 0; i < (n || 12); i++) {
                data.push({
                    name: Ext.Date.monthNames[i % 12],
                    data: Math.floor(Math.max((Math.random() * 100), floor))
                });
            }
            return data;
        };
        var store = Ext.create('Ext.data.JsonStore', {
            fields: ['name', 'data'],
            data: generateData()
        });
        
        var myPanel  = Ext.create('Ext.tab.Panel', {
                region: 'center',
                enableTabScroll: true,
                defaults: {
                    border: false,
                    activeTab: 0,
                    layout: 'fit',
                    closable: true
                },
                items:[{
                    xtype: 'panel',
                    title: 'Tab1',
                    closable: false,
                    items: [{
                        xtype: 'chart',
                        animate: true,
                        store: store,
                        insetPadding: 60,
                        theme: 'Base:gradients',
                        series: [{
                            type: 'pie',
                            field: 'data',
                            showInLegend: true
                        }]
                    }]
                },{
                    xtype: 'panel',
                    title: 'Tab2',
                    closable: false,
                    items: [{
                        xtype: 'chart',
                        store: store,
                        insetPadding: 60,
                        theme: 'Base:gradients',
                        series: [{
                            type: 'pie',
                            field: 'data'
                        }]
                    }]
                }]
        });
    
    
        var viewport = new Ext.Viewport({
            layout: 'border',
            border: false,
            items: [myPanel]
        }); //eo viewport    
        
    }); // eo function onReady

  4. #4
    Sencha User
    Join Date
    Nov 2008
    Posts
    24
    Vote Rating
    0
    manoj123 is on a distinguished road

      0  

    Default


    After eliminating line by line, I found

    Code:
     theme: 'Base:gradients',

    is the problem creator. Any reason why same theme cannot be used in different piecharts?

  5. #5
    Sencha User
    Join Date
    Nov 2008
    Posts
    24
    Vote Rating
    0
    manoj123 is on a distinguished road

      0  

    Default


    Removing the theme configuration worked fine. I wanted to use Chart theme to determine the colour based on the chart data.

    Can experts help me with this? I am unable to use theme to render charts in different tab panels.

  6. #6
    Sencha User
    Join Date
    Nov 2008
    Posts
    24
    Vote Rating
    0
    manoj123 is on a distinguished road

      0  

    Default


    Can anyone shed some light into this issue? Please!!!

    Happy New Year.

Thread Participants: 1

Tags for this Thread