代码如下:
Ext.namespace('app.ux')
app.ux.PrintBoard=Ext.extend(Ext.util.Observable,{
    
    store:null,
    title:null,
    printBoard:null,
    fields:null,
    constructor:function(config){
        Ext.apply(this,config);
    //        app.ux.PrintBoard.superclass.constructor.call(this);
    },
    init:function(container){
        container.render=container.render.createSequence(function(){
            
            },this);
    },
    initPrintBoard:function(){
        var layer=new Ext.Layer({
            dh:{
                tag:'div',
                id:'printBoard'
            },
            zindex:100000
        });
        
        this.printBoard=new Ext.Window({
            viewConfig:{
                forceFit:true
            },
            renderTo:'printBoard',
            height:400,
            width:500
        //            width:500,
        //            height:400
        });
        layer.setX(300);
        layer.setY(200);
        this.printBoard.show();
        layer.show();
    },
    draw:function(drawer,append){
        drawer.draw(this.printBoard,append);
        this.printBoard.doLayout();
    },
    setXField:function(xField){
        this.xField=xField;
    },
    setXDdisplayName:function(xDisplayName){
        this.xDisplayName=xDisplayName;
    },
    setYDisplayName:function(yDisplayName){
        this.yDisplayName=yDisplayName;
    },
    setYField:function(yField){
        this.yField=yField;
    }
});///////////////////drawer definition////////////////////////////
app.ux.Drawer=Ext.extend(Ext.util.Observable,{
    initStore:function(){
        
    },
    constructor:function(config){
        Ext.apply(this,config)
        app.ux.Drawer.superclass.constructor.call(this);
    },
    draw:function(printBoard,append){
        
        if(append==undefined||append==false){
    //            printBoard.removeAll();
    }
    },
    setTitle:function(title){
        
    }
});

解决方案 »

  1.   


    //////////////////////implement of Drawer////////////////////////////////
    app.ux.ChartDrawer=function(config){
        Ext.apply(this,config);
        app.ux.ChartDrawer.superclass.constructor.call(this);
    }
    Ext.extend(app.ux.ChartDrawer,app.ux.Drawer)
    app.ux.ChartDrawer.prototype={
        xField:null,
        yField1:null,
        yDisplayName:null,
        store:null,
        condition:'*:*',
        searchField:'brand',
        initStore:function(){
            this.store= new app.ux.AggregateStore({
                //                autoLoad:true,
                summaryField:this.yField,
                sortInfo:{
                    field:this.xField,
                    direction:'ASC'
                },
                url:'RecordLoader',
                groupField:this.xField,
                reader:new Ext.data.JsonReader({
                    idProperty:'sequenceNumber',
                    root:'data',
                    fields:['sequenceNumber',
                    'brand',{
                        name:'quantity',
                        type:'int'
                    },{
                        name:'total',
                        type:'float'
                    },'code',{
                        name:'salePrice',
                        type:'float'
                    },{
                        name:'price',
                        type:'float'
                    },{
                        name:'profit',
                        type:'float'
                    }]
                }),
                baseParams:{
                    start:0,
                    limit:50,
                    data:Ext.encode({
                        condition:this.condition,
                        fields:this.searchField,
                        target:'detail',
                        relative:'detail_fields'
                    })
                }
            })
            
        },
        draw:function(printBoard,append){
            this.initStore();
            app.ux.ChartDrawer.superclass.draw.call(printBoard.append);
            printBoard.add({
                xtype: 'columnchart',
                store:this.store,
                url:'ExtPacket/images/chart/charts.swf',
                xField: this.xField,
                yAxis: new Ext.chart.NumericAxis({
                    title:this.yDisplayName,
                    
                    labelRenderer : Ext.util.Format.numberRenderer('0,000.00')
                }),
                xAxis: new Ext.chart.CategoryAxis({
                    title: '产品代号'
                }),
                tipRenderer : function(chart, record, index, series){
                    if(series.yField == 'quantity'){
                        return record.data[this.xField]+' 销售总数为:'+Ext.util.Format.number(record.data.quantity, '0,0');
                    }else if(series.yField == 'total'){
                        return record.data[this.xField]+' 销售总额为:'+Ext.util.Format.number(record.data.total, '0,000.00');
                    }else if(series.yField=='profit'){
                        return record.data[this.xField]+' 利润为:'+Ext.util.Format.number(record.data.profit, '0,000.00');
                    }
                },
                chartStyle: {
                    padding: 10,
                    animationEnabled: true,
                    font: {
                        name: 'Tahoma',
                        color: 0x444444,
                        size: 11
                    },
                    dataTip: {
                        padding: 5,
                        border: {
                            color: 0x99bbe8,
                            size:1
                        },
                        background: {
                            color: 0xDAE7F6,
                            alpha: .9
                        },
                        font: {
                            name: 'Tahoma',
                            color: 0x15428B,
                            size: 10,
                            bold: true
                        }
                    },
                    xAxis: {
                        color: 0x69aBc8,
                        majorTicks: {
                            color: 0x69aBc8, 
                            length: 4
                        },
                        minorTicks: {
                            color: 0x69aBc8, 
                            length: 2
                        },
                        majorGridLines: {
                            size: 1, 
                            color: 0xeeeeee
                        }
                    },
                    yAxis: {
                        color: 0x69aBc8,
                        majorTicks: {
                            color: 0x69aBc8, 
                            length: 4
                        },
                        minorTicks: {
                            color: 0x69aBc8, 
                            length: 2
                        },
                        majorGridLines: {
                            size: 1, 
                            color: 0xdfe8f6
                        }
                    }
                },
                series: [{
                    type: 'column',
                    displayName: '销售数量',
                    yField: this.yField,
                    style: {
                        image:'ExtPacket/images/chart/bar.gif',
                        mode: 'stretch',
                        color:0x99BBE8
                    }
                },{
                    type:'line',
                    displayName: '销售总金额',
                    yField: this.yField1,
                    style: {
                        color: 0x15cc8B
                    }
                },,{
                    type:'line',
                    title: '销售总金额',
                    yField: 'profit',
                    style: {
                        color: 0xff0000
                    }
                }]
            });
            this.store.load();
        },
        setTitle:function(title){
            this.title=title;
        },
        grouper:function(){
            this.localStore.load();
        },
        zip:function(store,rec){
            rec.data.total=this.store.sum(this.yField);
            rec.data.quantity=this.store.sum(this.yField1)
        }
    }
    app.ux.AggregateStore=Ext.extend(Ext.data.GroupingStore,{
        summaryField:null,
        constructor:function(config){
            Ext.apply(this,config);
            
            app.ux.AggregateStore.superclass.constructor.call(this);
            this.on('load',this.aggregate,this);
        },
        aggregate:function(){
            var rec=null;
            
            this.each(function(record){
                if(rec==null||rec.data[this.groupField]!=record.data[this.groupField]){
                    if(record.data.salePrice==undefined||record.data.salePrice==0){
                        record.data.salePrice=record.data.price;
                    }
                    record.data.profit=(record.data.salePrice-record.data.price)*record.data.quantity;
                    rec=record;
                    return;
                }
                
                if(rec.data[this.groupField]==record.data[this.groupField]){
                    var currentTotal=record.data.total;
                    record.data[this.summaryField]+=rec.data[this.summaryField];
                    record.data.quantity+=rec.data.quantity;
                    record.data.profit=(record.data.salePrice-record.data.price)*record.data.quantity;
                    record.data.profit+=rec.data.profit;
                    this.remove(rec);
                    //                alert('当前记录的总额:'+currentTotal+'上一条记录累加至:'+rec.data.total+'  当前记录累加至:'+record.data.total);
                    rec=record;
                    
                    
                }
                
            },this);
            
        //        this.commitChanges();
            
        }
        
    })
    Ext.onReady(function(){
        //////////////////////////
        var board=new app.ux.PrintBoard();
        board.initPrintBoard();
        var drawer=new app.ux.ChartDrawer({
            fields:['brand','total','quantity'],
            group:'code',
            xField:'code',
            yField:'total',
            yField1:'quantity',
            yDisplayName:'数量',
            yDisplayName1:'总额'
        });
        board.draw(drawer,true);
    /////////////////////////////////////
        
        
    })
      

  2.   

    使用PANEL不会有问题,使用window会出现问题。IE8/IE9兼容模式没有问题。应该是EXT-3.3.0的BUG.