PDA

View Full Version : The chart in the Ext.TabPanel is sometimes invisible in IE6 ( OK in the firefox )?



carolinfox
20 May 2010, 4:30 AM
<html>
<head>
<link rel="stylesheet" type="text/css" href="./extjs/resources/css/ext-all.css"/>
<script type="text/javascript" src="./extjs/adapter/ext/ext-base-debug.js"></script>
<script type="text/javascript" src="./extjs/ext-all-debug.js"></script>
<script type="text/javascript">
Ext.onReady(function() {
var pieStore = new Ext.data.JsonStore({
fields:['type', 'count'],
autoLoad:true,
data: [
{
type:'Jul 07',
count: 2450
},
{
type:'Aug 07',
count: 2400
},
{
type:'Sep 07',
count: 3550
}

]
});
var pieChart = new Ext.Panel({
title: '??',
autoWidth:true,
height:300,
items:{
xtype: 'piechart',
store: pieStore,
dataField : 'count',
categoryField : 'type',
extraStyle:
{
legend:
{
display: 'bottom',
padding: 5,
font:
{
family: 'Tahoma',
size: 13
}
}
}
,
listeners: {
itemclick: function(o) {
var rec = pieStore.getAt(o.index);
}
}
}
});

var lineStore = new Ext.data.JsonStore({
fields:['time', 'sumRun','sumBak','sumStop','sumDef','sumBrw','sumNnd','sumOth'],
autoLoad:true,
data: [
{
time:'Jul 07',
sumRun: 5,
sumBak:6,
sumStop:7,
sumDef:9,
sumBrw:2,
sumNnd:3,
sumOth:3
},
{
time:'Aug 07',
sumRun: 2,
sumBak:3,
sumStop:1,
sumDef:2,
sumBrw:6,
sumNnd:2,
sumOth:1
},
{
time:'Sep 07',
sumRun: 10,
sumBak:12,
sumStop:13,
sumDef:9,
sumBrw:5,
sumNnd:12,
sumOth:11
}

]
});
var lineChart = new Ext.Panel({
title: '??',
autoWidth:true,
height:300,
items:{
xtype: 'linechart',
store: lineStore,
xField: 'time',
yAxis: new Ext.chart.NumericAxis({
majorUnit:1
}),
extraStyle:
{
legend:
{
display: 'bottom',
padding: 5,
font:
{
family: 'Tahoma',
size: 13
}
}
},
series: [
{
type: 'line',
displayName: '??',
yField: 'sumRun'
},
{
type:'line',
displayName: '??',
yField: 'sumBak'
},
{
type:'line',
displayName: '????',
yField: 'sumDef'
},
{
type:'line',
displayName: '????',
yField: 'sumStop'
},
{
type:'line',
displayName: '??',
yField: 'sumBrw'
},
{
type:'line',
displayName: '???',
yField: 'sumNnd'
},
{
type:'line',
displayName: '??',
yField: 'sumOth'

}
]
,
listeners: {
itemclick: function(o) {
var rec = lineStore.getAt(o.index);
}
}
},listeners:{

}
});

new Ext.TabPanel({
activeTab: 0,
renderTo: Ext.getBody(),
autoWidth:true,
// autoHeight:true,
plain:true,
defaults:{autoScroll: true},
items:[
pieChart,lineChart
],

listeners:{

}
})
})
</script>
</head>
<body>
</body>
</html>