Extjs4.1:一个column chart结构

来源:互联网 发布:js sort 排序 编辑:程序博客网 时间:2024/04/28 21:23
    var chart = Ext.create('Ext.chart.Chart', {            id: 'chartCmp',            xtype: 'chart',            style: 'background:#fff',            animate: true,            shadow: true,            store: 'store_gyzjz2012_11',            axes: [{                type: 'Numeric',                position: 'left',//纵坐标轴:增加值                fields: ['BYZC'],                label: {                    renderer: Ext.util.Format.numberRenderer('0,0')                },                title: 'Number of Hits',                grid: true,                minimum: 0            }, {                type: 'Category',                position: 'bottom',//横坐标轴:分类                fields: ['GYZJZ'],                title: 'Month of the Year',label: {                    rotate: {                    degrees: 30}}            }],            series: [{                type: 'column',                axis: 'left',                highlight: true,//鼠标移过,提示内容                tips: {                  trackMouse: true,                  renderer: function(storeItem, item) {                    this.setTitle(storeItem.get('GYZJZ') + ': ' + storeItem.get('BYZC'));                  }                },//column中标签内容和显示方式                label: {                  display: 'insideEnd',                  'text-anchor': 'middle',                    field: 'BYZC',                    renderer: Ext.util.Format.numberRenderer('0'),                    orientation: 'vertical',                    color: '#333'                },//x轴字段                xField: 'GYZJZ',//y轴字段                yField: 'BYZC'            }]        });    var winColumnChart = Ext.create('Ext.Window', {        width: 800,        height: 550,        //minHeight: 400,        //minWidth: 550,        hidden: false,closable: true,        closeAction: 'hide',        maximizable: true,        title: 'Column Chart',        //renderTo: Ext.getBody(),        layout: 'fit',        tbar: [{            text: '保存图表',            handler: function() {                Ext.MessageBox.confirm('下载确认', '您确认要下载该图片吗?', function(choice){                    if(choice == 'yes'){                        chart.save({                            type: 'image/png'                        });                    }                });            }        }],        items: chart        });


原创粉丝点击