PDA

View Full Version : [FIXED] Chart with gradients turns black when displayed on more than one tab page.



tore.erstad
18 Nov 2011, 3:18 AM
REQUIRED INFORMATION

Ext version tested:

Ext 4.0.7
Browser versions tested against:

FF8.0 (firebug installed)
Description:

When chart with gradients is used on two or more tab pages, the chart turns black on second page and forward.
Steps to reproduce the problem:

Create a chart with theme 'Base:gradiants'. Display the chart in two tab pages.

The result that was expected:

The chart should be shown with colors and gradients on both tab pages.
The result that occurs instead:

The chart is shown with colors and gradients on first tab page, black on second.
Test Case:



Ext.require('Ext.chart.*');


Ext.define('My.TestChart', {
extend: 'Ext.chart.Chart',
alias: 'widget.testchart',
width: 100,
height: 100,
theme: 'Base:gradients',
series: [{
type: 'pie',
field: 'value'
}],
initComponent: function(){
this.store = Ext.create('Ext.data.Store', {
fields: ['value'],
data: [{
value: 1
}, {
value: 2
}]
});
this.callParent();
}
});


Ext.onReady(function(){
Ext.create('Ext.tab.Panel', {
renderTo: Ext.getBody(),
items: [{
xtype: 'testchart',
title: 'Chart 1'
}, {
xtype: 'testchart',
title: 'Chart 2'
}]
});
});







HELPFUL INFORMATION

Screenshot or Video:

attached
Operating System:

Windows 7 Enterprise

mitchellsimoens
19 Nov 2011, 2:52 PM
What happens when you put the series within the initComponent?

tore.erstad
20 Nov 2011, 11:24 PM
Hi,
I tried to setup the series in initComponent, but it didn't resolve the issue.
If I put it before call to parent, the graph is still black on the second tab page.
If I put it after call to parent, I get an exception: me.series.each is not a function.

mitchellsimoens
21 Nov 2011, 7:35 AM
Hi,
I tried to setup the series in initComponent, but it didn't resolve the issue.
If I put it before call to parent, the graph is still black on the second tab page.
If I put it after call to parent, I get an exception: me.series.each is not a function.

Dang, was hoping the series was getting shared. I've pushed this up to our bug tracker.

tore.erstad
21 Nov 2011, 11:29 PM
Thanks,
The workaround is simply not using gradients on the chart. Not really a workaround, I know..

hellowahab
30 Jan 2012, 12:09 AM
I am facing same issue

hellowahab
30 Jan 2012, 12:56 AM
I just rename
theme: 'Base:gradients',
to
theme: 'Base:gradients1',

And it worked.