Ext4修改column chart的住形体的背景颜色

Ext.onReady(function() {
   var store = Ext.create('Ext.data.JsonStore', {
      fields : ['name', 'money', 'count'],
      data : [{
         'name' : '云应用服务',
         'money' : 10000,
         'count' : 20000
        }, {
         'name' : '云数据服务',
         'money' : 40000,
         'count' : 10000
        }, {
         'name' : '云存储服务',
         'money' : 30000,
         'count' : 25000
        }]
     });
   Ext.create('Ext.chart.Chart', {
      renderTo : Ext.getBody(),
      width : 500,
      height : 300,
      animate : true,
      store : store,
      axes : [{
         type : 'Numeric',
         position : 'left',
         fields : ['money', 'count'],
         maximum : 100000,
         title : '总金额和总数量',
         minimum : 0
        }, {
         type : 'Category',
         position : 'bottom',
         fields : ['name'],
         title : '服务'
        }],
      legend : {
       position : 'bottom',
       labelColor : '#003399'
      },
      series : [{
         type : 'column',
         axis : 'left',
         style:{
                         'colors':['#FF6666', '#ABC7EC'] //颜色
         },
         xField : 'name',
         yField : ['money', 'count'],
         title : ['服务消费总金额', '服务总数量'],
         label : {
          field : ['money', 'count'],
          display : 'outside',
          renderer : function(v) {
           return v;
          },
          font : '18px Arial'
         }
        }]
     });
  });

然后重写Bar.js中的方法，重写方法见附件myBar.rar  
  
 

转载于:https://blog.51cto.com/angelgirl/968226