PDA

View Full Version : charts in tabpanel is sometimes blank in IE



Kelly0108
26 May 2010, 7:19 PM
I am using line chart in tabpanel. I have two tabs. Tab A, Tab B.
one chart in tab A,another in in tab B.
ActiveTab is tab A,when i change to tab B,the chart in this tab sometimes is show blank.

OR when a chart is hidden,i change it to show,it maybe also show blank chart.

but,it works great in FireFox,only in IE sometimes show blank.


Code:
public method:


Ext.chart.Chart.CHART_URL = '../../resources/charts.swf';
Ext.BLANK_IMAGE_URL = '../../resources/images/default/s.gif';

//??????????????formatNum(100.12345678,4)
function formatNum(Num1,Num2){
if(isNaN(Num1)||isNaN(Num2)){
return(0);
}else{
Num1=Num1.toString();
Num2=parseInt(Num2);
if(Num1.indexOf('.')==-1){
return(Num1);
}else{
var b=Num1.substring(0,Num1.indexOf('.')+Num2+1);
var c=Num1.substring(Num1.indexOf('.')+Num2+1,Num1.indexOf('.')+Num2+2);
if(c==""){
return(b);
}else{
if(parseInt(c)<5){
return(b);
}else{
return((Math.round(parseFloat(b)*Math.pow(10,Num2))+Math.round(parseFloat(Math.pow(0.1,Num2).toString().substring(0,Math.pow(0.1,Num2).toString().indexOf('.')+Num2+1))*Math.pow(10,Num2)))/Math.pow(10,Num2));
}
}
}
}
}
/* ????? */
function renderDateRange(value, p, record){
return "2010?"+value+"?";
}
/* ??????:??+??*/
function renderCJRJHJ(value, p, record){
return Ext.util.Format.number(record.data.rj+record.data.cj,'0,0');
}
/* ????:??+??*/
function renderCJRJHJSUM(value, p, record){
return Ext.util.Format.number(record.data.rjsum+record.data.cjsum,'0,0');
}
/* ?????:(??+??)/2*/
function renderCJRJAVJCL(value, p, record){
return formatNum((record.data.rj+record.data.cj)/(record.data.rjsum+record.data.cjsum),2)+'%';
}
/* ?????:(??+??)/2*/
function renderCJRJAVJCL1(value, p, record){
return formatNum((record.data.rjjcl+record.data.cjjcl)/2,2)+'%';
}
/* ???????,??????????*/
function renderZSJ(v,para,record){
return "<a href='zsj_slqs.html' target='_blank'>"+v+"</a>";
}
/* ???????,??????????*/
function renderFZJ(v,para,record){
return "<a href='fzj_slqs.html' target='_blank'>"+v+"</a>";
}
/* ????????? */
function renderDateRangeZSJ(value, p, record){
return "<a href='zsjslqs_zz.html' target='_blank'>2010?"+value+"?</a>";
}
/* ???????? */
function renderDateRangeZJ(value, p, record){
return "<a href='zjslqs_zz.html' target='_blank'>2010?"+value+"?</a>";
}
/* ????? */
function renderRJJCL(v, params, data){return formatNum(data.data.rj/data.data.rjsum,2)+'%';}
/* ????? */
function renderCJJCL(v, params, data){return formatNum(data.data.cj/data.data.cjsum,2)+'%';}



charts&tabpanel code:



/*
*???????????????
* ??????????
*/
var store_jcslqxl = new Ext.data.JsonStore({
fields:['dateRange','rj' ,'cj','hj','rjjcl','cjjcl','avjcl','rjsum','cjsum','hjsum'],
data: [
{dateRange:1,rj:6790, cj:8098,rjjcl:10.89,cjjcl:14.86,rjsum:100909,cjsum:201899},
{dateRange:2,rj:5080, cj:8001,rjjcl:0.89,cjjcl:4.86,rjsum:178009,cjsum:782019},
{dateRange:3,rj:4690, cj:7809,rjjcl:13.43,cjjcl:12.34,rjsum:107809,cjsum:206719},
{dateRange:4,rj:3001, cj:5000,rjjcl:12.29,cjjcl:14.34,rjsum:13069,cjsum:20189},
{dateRange:5,rj:2030, cj:3200,rjjcl:12.32,cjjcl:13.24,rjsum:18009,cjsum:62019},
{dateRange:6,rj:1090, cj:2500,rjjcl:12.43,cjjcl:12.36,rjsum:10909,cjsum:20198},
{dateRange:7,rj:1900, cj:1200,rjjcl:13.45,cjjcl:14.56,rjsum:10509,cjsum:20197},
{dateRange:8,rj:1000, cj:2120,rjjcl:12.14,cjjcl:15.36,rjsum:12009,cjsum:20719},
{dateRange:9,rj:2100, cj:1000,rjjcl:19.29,cjjcl:14.21,rjsum:11009,cjsum:20519},
{dateRange:10,rj:950, cj:2100,rjjcl:2.12,cjjcl:12.2,rjsum:10029,cjsum:20419},
{dateRange:11,rj:1020, cj:1200,rjjcl:4.32,cjjcl:14.34,rjsum:10309,cjsum:20319},
{dateRange:12,rj:1300, cj:1010,rjjcl:11.24,cjjcl:12.86,rjsum:10409,cjsum:12019}
]
});

groupRow_jcslqxl=[];
groupRow_jcslqxl=[
{header: '', colspan: 1, align: 'center'},
{header: '??', colspan: 3, align: 'center' },
{header: '??',colspan: 3, align: 'center'},
{header: '??',colspan: 3, align: 'center'}
]

var group_jcslqxl = new Ext.ux.grid.ColumnHeaderGroup({
rows: [groupRow_jcslqxl]
});
var grid_jcslqxl = new Ext.grid.GridPanel({
store: store_jcslqxl,
//title:"??????",
plugins: [new Ext.ux.grid.GridSummary(),group_jcslqxl],
viewConfig: {
forceFit: true
},
border: true,
collapsed:false,
animCollapse:false,
columns: [
{id:'dateRange',header: '??',renderer:renderDateRangeZJ, dataIndex: 'dateRange',summaryRenderer: function(v, params, data){return '??';}},
{header: '???', summaryType: 'sum',sortable: true,renderer: Ext.util.Format.numberRenderer('0,0'), dataIndex: 'rj',align:'right'},
{header: '??', summaryType: 'sum',sortable: true,renderer: Ext.util.Format.numberRenderer('0,0'), dataIndex: 'rjsum',align:'right'},
{header: '???', summaryType: 'average',sortable: true,renderer: function(v, params, data){return formatNum(v,2)+'%';}, dataIndex: 'rjjcl',align:'right'},
{header: '???', summaryType: 'sum',dataIndex: 'cj',sortable: true,renderer: Ext.util.Format.numberRenderer('0,0'),align:'right'},
{header: '??', summaryType: 'sum',sortable: true,renderer: Ext.util.Format.numberRenderer('0,0'), dataIndex: 'cjsum',align:'right'},
{header: '???', summaryType: 'average',dataIndex: 'cjjcl',sortable: true,renderer: function(v, params, data){return formatNum(v,2)+'%';},align:'right'},
{header: '?????', summaryType: 'sum',sortable: true,renderer:renderCJRJHJ, dataIndex: 'hj',align:'right'},
{header: '????', summaryType: 'sum',sortable: true,renderer:renderCJRJHJSUM, dataIndex: 'hjsum',align:'right'},
{header: '?????', summaryType: 'average',sortable: true,renderer:renderCJRJAVJCL1, dataIndex: 'avjcl',align:'right'}
],
height:220
});
var panel_chart_jcslqxl = new Ext.Panel({
height:210,
// width:380,
layout:'fit',
collapsed:false,
// collapsible:true,
animCollapse:false,
items: {
xtype: 'linechart',
store: store_jcslqxl,
xField: 'dateRange',
yAxis: new Ext.chart.NumericAxis({
title: '???',
displayName: '???',
// maximum:9000,
// majorUnit:1000,
labelRenderer : Ext.util.Format.numberRenderer('0,0')

}),
xAxis:new Ext.chart.CategoryAxis({
title: '??',
labelRenderer :function(v, params, data){return v+'?';}
}),
tipRenderer : function(chart, record, index, series){
if(series.yField == 'rj'){
return "??("+record.data.dateRange+"?)?"+Ext.util.Format.number(record.data.rj, '0,0');
}else{
return "??("+record.data.dateRange+"?)?"+Ext.util.Format.number(record.data.cj, '0,0');
}
},
extraStyle:{
animationEnabled:false,
legend : {
display: 'right',
padding:5,
font:{
family: 'Tahoma'
}
},
yAxis : {
titleRotation : -90
}
},
series: [{
type: 'line',
displayName: '??',
yField: 'rj',
style:{
color:0xEEAA99,
size:5,
lineSize:1
}
},{
type: 'line',
displayName: '??',
yField: 'cj',
style: {
size:5,
lineSize:1,
color: 0x22A9bb
}
}]
}
});
/** ??????? */
var panel_chart_jcslqxl_jcl = new Ext.Panel({
height:210,
// width:380,
layout:'fit',
collapsed:false,
hidden:true,
// collapsible:true,
animCollapse:false,
items: {
xtype: 'linechart',
store: store_jcslqxl,
xField: 'dateRange',
tipRenderer : function(chart, record, index, series){
if(series.yField == 'rjjcl'){
return "??("+record.data.dateRange+"?)?"+formatNum(record.data.rjjcl,2)+'%';
}else{
return "??("+record.data.dateRange+"?)?"+formatNum(record.data.cjjcl,2)+'%';
}
},
extraStyle:{
animationEnabled:false,
legend : {
display: 'right',
padding:5
},
yAxis : {
titleRotation : -90
}
},
series: [{
type: 'line',
displayName: '??',
yField: 'rjjcl',
style:{
color:0xEEAA99,
size:5,
lineSize:1
}
},{
type: 'line',
displayName: '??',
yField: 'cjjcl',
style: {
size:5,
lineSize:1,
color: 0x22A9bb
}
}],
yAxis: new Ext.chart.NumericAxis({
title: '???',
displayName: '???',
// maximum:9000,
// majorUnit:1000,
labelRenderer : Ext.util.Format.numberRenderer('0,0')

}),
xAxis:new Ext.chart.CategoryAxis({
title: '??',
labelRenderer :function(v, params, data){return v+'?';}
})
}
});

/*
* ?????????????
* ??????????
*/
var store_jcslqxlbd = new Ext.data.JsonStore({
fields:['zsj','rj' ,'cj','hj','rjjcl','cjjcl','avjcl','rjsum','cjsum','hjsum'],
data: [
{zsj:'??',rj:790, cj:898,rjjcl:10.89,cjjcl:14.86,rjsum:1009,cjsum:2019},
{zsj:'??',rj:500, cj:801,rjjcl:9.24,cjjcl:9.89,rjsum:10209,cjsum:20149},
{zsj:'??',rj:457, cj:709,rjjcl:11.43,cjjcl:8.23,rjsum:21009,cjsum:21019},
{zsj:'??',rj:684, cj:358,rjjcl:15.12,cjjcl:7.54,rjsum:13009,cjsum:12019},
{zsj:'??',rj:458, cj:845,rjjcl:9.96,cjjcl:1.17,rjsum:10609,cjsum:20195},
{zsj:'??',rj:674, cj:456,rjjcl:9.01,cjjcl:5.53,rjsum:15009,cjsum:11496},
{zsj:'??',rj:678, cj:789,rjjcl:5.23,cjjcl:9.45,rjsum:14009,cjsum:22019},
{zsj:'??',rj:564, cj:345,rjjcl:4.23,cjjcl:9.87,rjsum:10309,cjsum:20195},
{zsj:'??',rj:678, cj:446,rjjcl:2.12,cjjcl:3.27,rjsum:21009,cjsum:20196},
{zsj:'??',rj:689, cj:567,rjjcl:9.25,cjjcl:7.54,rjsum:14029,cjsum:20194},
{zsj:'??',rj:353, cj:564,rjjcl:9.67,cjjcl:5.43,rjsum:10359,cjsum:2039},
{zsj:'??',rj:800, cj:789,rjjcl:6.87,cjjcl:9.11,rjsum:5009,cjsum:2019},
{zsj:'??',rj:790, cj:898,rjjcl:10.89,cjjcl:14.86,rjsum:1009,cjsum:2019},
{zsj:'??',rj:500, cj:801,rjjcl:9.24,cjjcl:9.89,rjsum:10209,cjsum:20149},
{zsj:'???',rj:457, cj:709,rjjcl:11.43,cjjcl:8.23,rjsum:21009,cjsum:21019},
{zsj:'??',rj:684, cj:358,rjjcl:15.12,cjjcl:7.54,rjsum:13009,cjsum:12019},
{zsj:'??',rj:458, cj:845,rjjcl:9.96,cjjcl:1.17,rjsum:10609,cjsum:20195},
{zsj:'??',rj:674, cj:456,rjjcl:9.01,cjjcl:5.53,rjsum:15009,cjsum:11496},
{zsj:'??',rj:678, cj:789,rjjcl:5.23,cjjcl:9.45,rjsum:14009,cjsum:22019},
{zsj:'??',rj:564, cj:345,rjjcl:4.23,cjjcl:9.87,rjsum:10309,cjsum:20195},
{zsj:'??',rj:678, cj:446,rjjcl:2.12,cjjcl:3.27,rjsum:21009,cjsum:20196},
{zsj:'??',rj:689, cj:567,rjjcl:9.25,cjjcl:7.54,rjsum:14029,cjsum:20194},
{zsj:'??',rj:790, cj:898,rjjcl:10.89,cjjcl:14.86,rjsum:1009,cjsum:2019},
{zsj:'??',rj:500, cj:801,rjjcl:9.24,cjjcl:9.89,rjsum:10209,cjsum:20149},
{zsj:'??',rj:457, cj:709,rjjcl:11.43,cjjcl:8.23,rjsum:21009,cjsum:21019},
{zsj:'??',rj:684, cj:358,rjjcl:15.12,cjjcl:7.54,rjsum:13009,cjsum:12019},
{zsj:'??',rj:458, cj:845,rjjcl:9.96,cjjcl:1.17,rjsum:10609,cjsum:20195},
{zsj:'???',rj:674, cj:456,rjjcl:9.01,cjjcl:5.53,rjsum:15009,cjsum:11496},
{zsj:'??',rj:678, cj:789,rjjcl:5.23,cjjcl:9.45,rjsum:14009,cjsum:22019},
{zsj:'??',rj:689, cj:567,rjjcl:9.25,cjjcl:7.54,rjsum:14029,cjsum:20194}
]
});
groupRow_jcslqxlbd=[];
groupRow_jcslqxlbd=[
{header: '', colspan: 1, align: 'center'},
{header: '??', colspan: 3, align: 'center' },
{header: '??',colspan: 3, align: 'center'},
{header: '??',colspan: 3, align: 'center'}
]

var group_jcslqxlbd = new Ext.ux.grid.ColumnHeaderGroup({
rows: [groupRow_jcslqxlbd]
});
var grid_jcslqxlbd = new Ext.grid.GridPanel({
store: store_jcslqxlbd,
plugins: [new Ext.ux.grid.GridSummary(),group_jcslqxlbd],
viewConfig: {
forceFit: true
},
border: true,
collapsed:false,
animCollapse:false,
columns: [
{id:'zsj',header: '???',renderer:renderZSJ, dataIndex: 'zsj',summaryRenderer: function(v, params, data){return '??';}},
{header: '???', summaryType: 'sum',sortable: true,renderer: Ext.util.Format.numberRenderer('0,0'), dataIndex: 'rj',align:'right'},
{header: '??', summaryType: 'sum',sortable: true,renderer: Ext.util.Format.numberRenderer('0,0'), dataIndex: 'rjsum',align:'right'},
{header: '???', summaryType: 'average',sortable: true,renderer: function(v, params, data){return formatNum(v,2)+'%';}, dataIndex: 'rjjcl',align:'right'},
{header: '???', summaryType: 'sum',dataIndex: 'cj',sortable: true,renderer: Ext.util.Format.numberRenderer('0,0'),align:'right'},
{header: '??', summaryType: 'sum',sortable: true,renderer: Ext.util.Format.numberRenderer('0,0'), dataIndex: 'cjsum',align:'right'},
{header: '???', summaryType: 'average',dataIndex: 'cjjcl',sortable: true,renderer: function(v, params, data){return formatNum(v,2)+'%';},align:'right'},
{header: '?????', summaryType: 'sum',sortable: true,renderer:renderCJRJHJ, dataIndex: 'hj',align:'right'},
{header: '????', summaryType: 'sum',sortable: true,renderer:renderCJRJHJSUM, dataIndex: 'hjsum',align:'right'},
{header: '?????', summaryType: 'average',sortable: true,renderer:renderCJRJAVJCL1, dataIndex: 'avjcl',align:'right'}
],
height:220
});

var panel_chart_jcslqxlbd = new Ext.Panel({
height:210,
// width:380,
layout:'fit',
collapsed:false,
// collapsible:true,
animCollapse:false,
items: {
xtype: 'columnchart',
store: store_jcslqxlbd,
xField: 'zsj',
tipRenderer : function(chart, record, index, series){
if(series.yField == 'rj'){
return "??("+record.data.zsj+")?"+Ext.util.Format.number(record.data.rj, '0,0');
}else{
return "??("+record.data.zsj+")?"+Ext.util.Format.number(record.data.cj, '0,0');
}
},
extraStyle:{
animationEnabled:false,
legend : {
display: 'right',
padding:5
},
yAxis : {
titleRotation : -90
},
xAxis : {
labelRotation : -90
}
},
series: [{
type: 'column',
displayName: '??',
yField: 'rj',
style:{
color:0xEEAA99,
size: 10
}
},{
type: 'column',
displayName: '??',
yField: 'cj',
style: {
color: 0x22A9bb,
size: 10
}
}],
yAxis: new Ext.chart.NumericAxis({
title: '???',
displayName: '???',
// maximum:9000,
// majorUnit:1000,
labelRenderer : Ext.util.Format.numberRenderer('0,0')

}),
xAxis:new Ext.chart.CategoryAxis({
title: '???'
})
}
});
/** ???????? */
var panel_chart_jcslqxlbd_jcl = new Ext.Panel({
height:210,
// width:380,
layout:'fit',
collapsed:false,
hidden:true,
// collapsible:true,
animCollapse:false,
items: {
xtype: 'columnchart',
store: store_jcslqxlbd,
xField: 'zsj',
tipRenderer : function(chart, record, index, series){
if(series.yField == 'rjjcl'){
return "??("+record.data.zsj+")?"+formatNum(record.data.rjjcl,2)+'%';
}else{
return "??("+record.data.zsj+")?"+formatNum(record.data.cjjcl,2)+'%';
}
},
extraStyle:{
animationEnabled:false,
legend : {
display: 'right',
padding:5
},
yAxis : {
titleRotation : -90
},
xAxis : {
labelRotation : -90
}
},
series: [{
type: 'column',
displayName: '??',
yField: 'rjjcl',
style:{
color:0xEEAA99,
size: 10
}
},{
type: 'column',
displayName: '??',
yField: 'cjjcl',
style: {
color: 0x22A9bb,
size: 10
}
}],
yAxis: new Ext.chart.NumericAxis({
title: '???',
displayName: '???',
// maximum:9000,
// majorUnit:1000,
labelRenderer : Ext.util.Format.numberRenderer('0,0')

}),
xAxis:new Ext.chart.CategoryAxis({
title: '???'
})
}
});
/*
*??????????
* ??????????
*/
var store_zjycyyfx= new Ext.data.JsonStore({
fields:['reasons','rj' ,'cj','hj'],
data: [
{reasons:'??????',rj:230, cj:190,hj:420},
{reasons:'????????',rj:250, cj:280,hj:530},
{reasons:'????',rj:200, cj:120,hj:320},
{reasons:'???????',rj:80, cj:34,hj:114},
{reasons:'???????',rj:100, cj:250,hj:350},
{reasons:'??????',rj:90, cj:60,hj:150},
{reasons:'??',rj:140, cj:160,hj:300}
]
});

var grid_zjycyyfx = new Ext.grid.GridPanel({
store: store_zjycyyfx,
plugins: [new Ext.ux.grid.GridSummary()],
viewConfig: {
forceFit: true
},
height:210,
stripeRows: true,
border: true,
collapsed:false,
animCollapse:false,
columns: [
{id:'reasons',header: '????',dataIndex: 'reasons',summaryRenderer: function(v, params, data){return '??';}},
{header: '??', summaryType: 'sum',sortable: true,renderer: Ext.util.Format.numberRenderer('0,0'), dataIndex: 'rj',align:'right'},
{header: '??', summaryType: 'sum',dataIndex: 'cj',sortable: true,renderer: Ext.util.Format.numberRenderer('0,0'),align:'right'},
{header: '??', summaryType: 'sum',sortable: true,renderer:renderCJRJHJ, dataIndex: 'hj',align:'right'}
]
});
var chart_zjycyyfx_rj = new Ext.chart.PieChart({
store: store_zjycyyfx,
height:210,
width:370,
title: '????????--??',
dataField: 'rj',
categoryField: 'reasons',
extraStyle:{
animationEnabled:false,
legend:
{
display: 'right',
padding: 5
}
}
});
var chart_zjycyyfx_cj = new Ext.chart.PieChart({
store: store_zjycyyfx,
height:210,
width:370,
title: '????????--??',
dataField: 'cj',
categoryField: 'reasons',
extraStyle:{
animationEnabled:false,
legend:
{
display: 'right',
padding: 5
}
}
});
var chart_zjycyyfx_hj = new Ext.chart.PieChart({
store: store_zjycyyfx,
height:210,
width:370,
title: '????????--??',
dataField: 'hj',
categoryField: 'reasons',
extraStyle:{
animationEnabled:false,
legend:
{
display: 'right',
padding: 5
}
}
});
Ext.onReady(function(){
var tabs = new Ext.TabPanel({
renderTo: 'container',
activeTab: 0,
layoutOnTabChange:true,
enableTabScroll:true,
enableTabChange:true,
defaults:{autoHeight: true},
items:[
{
title: '????????',
items:[{
title:'?????2010.1--2010.12',
animCollapse:false,
tbar: [{
text: '???????',
iconCls: 'blist',
pressed: true,
enableToggle: true,
toggleGroup:'jcslqxlToggle',
handler: function(){
panel_chart_jcslqxl_jcl.hide();
panel_chart_jcslqxl.show();
this.toggle(true);
}
},{
text: '??????',
enableToggle: true,
toggleGroup:'jcslqxlToggle',
handler: function(){
panel_chart_jcslqxl.hide();
panel_chart_jcslqxl_jcl.show();
this.toggle(true);
}
}],
items:[panel_chart_jcslqxl,panel_chart_jcslqxl_jcl]
},grid_jcslqxl]
}
,{
title: '???????????',
animCollapse:false,
items:[{
title:'?????2010.1--2010.12',
tbar: [{
text: '???????',
pressed: true,
enableToggle: true,
toggleGroup:'jcslqxlbdToggle',
handler: function(){
panel_chart_jcslqxlbd_jcl.hide();
panel_chart_jcslqxlbd.show();
this.toggle(true);
}
},{
text: '??????',
iconCls: 'blist',
enableToggle: true,
toggleGroup:'jcslqxlbdToggle',
handler: function(){
panel_chart_jcslqxlbd.hide();
panel_chart_jcslqxlbd_jcl.show();
this.toggle(true);
}
}],
items:[panel_chart_jcslqxlbd,panel_chart_jcslqxlbd_jcl]
},grid_jcslqxlbd]
},{
title: '????????',
layout:'table',
layoutConfig: {columns:3},
items:[
{
title:'???2010.1--2010.12?',
items:chart_zjycyyfx_rj
},{
title:'???2010.1--2010.12?',
items:chart_zjycyyfx_cj
},{
title:'???2010.1--2010.12?',
items:chart_zjycyyfx_hj
},{
colspan: 3,
width:1110,
items:grid_zjycyyfx
}
]
}
]
});
});



html code:


<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Custom Layouts and Containers - Portal Example</title>
<!-- ** CSS ** -->
<!-- base library -->
<link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
<!-- overrides to base library -->

<link rel="stylesheet" type="text/css" href="../ux/css/Portal.css" />
<link rel="stylesheet" type="text/css" href="../ux/css/GroupSummary.css" />
<link rel="stylesheet" type="text/css" href="../ux/css/ColumnHeaderGroup.css" />
<link rel="stylesheet" type="text/css" href="../ux/css/GridSummary.css" />
<!-- page specific -->
<link rel="stylesheet" type="text/css" href="sample.css" />
<style type="text/css">
</style>
<!-- ** Javascript ** -->
<!-- ExtJS library: base/adapter -->
<script type="text/javascript" src="../../adapter/ext/ext-base.js"></script>
<!-- ExtJS library: all widgets -->
<script type="text/javascript" src="../../ext-all.js"></script>
<!-- overrides to base library -->
<script type="text/javascript" src="../ux/GridSummary.js"></script>
<script type="text/javascript" src="../ux/GroupSummary.js"></script>
<script type="text/javascript" src="../ux/ColumnHeaderGroup.js"></script>

<!-- page specific -->
<script type="text/javascript" src="sample-grid.js"></script>
<script type="text/javascript" src="../shared/examples.js"></script>
<script type="text/javascript" src="zj_pub.js"></script>
<script type="text/javascript" src="zj_slqs.js"></script>
<script>

</script>
</head>
<body>
<div id="container"></div>
</body>
</html>