extjs ColumnChart 怎么设置不同的颜色啊？？

Question

[color=red][b]下面代码有两根柱子.一个是显示工单数的一个是显示阀值的...现在要做的是如果工单数>=阀值则后面柱子的颜色还成其他的颜色..知道能不能做到[/b][/color]
[code="java"]
Ext.onReady(function(){
//定义store
var chartStore = new Ext.data.JsonStore({
root:'root',

      fields:[
        {name:'ne',type:'string'},//网元
        {name:'confine',type:'int'},//阀值
        {name:'bill',type:'string'}//工单数
      ],
      sortInfo:{field: 'bill', direction: 'ASC'}
    });

//测试数据
var obj={
        root:[
          {ne:'网元一',confine:80,bill:150},
          {ne:'网元二',confine:150,bill:140},
          {ne:'网元三',confine:180,bill:160},
          {ne:'网元五',confine:120,bill:180},
          {ne:'网元六',confine:165,bill:13},
          {ne:'网元七',confine:54,bill:12},
          {ne:'网元八',confine:55,bill:44},
          {ne:'网元九',confine:33,bill:113},
          {ne:'网元十',confine:122,bill:77}     
        ]
      }


//载入数据
chartStore.loadData(obj);
//pushlet 回调函数
window.onData = function (event) {
    //alert(event.get("data1"));
    var obj1 = eval('('+event.get("data1")+')');

    //obj=obj1;

    //chartStore.loadData(obj);
}
// 系统属性定义列数据模型
var cm = new Ext.grid.ColumnModel([new Ext.grid.RowNumberer(),
    {header:'网元',dataIndex:'ne'},
    {header:'工单量',dataIndex:'bill',renderer:function(value, cellMeta, record, rowIndex, columnIndex, store){
        var confine = record.data['confine']; 
        /*if(value>=confine){
            //cellMeta.css='x-grid-back-red';
            var row = cm.findColumnIndex(rowIndex);
            row.css='x-grid-back-red';
        }*/


        return value;
    }},
    {header:'阀值',dataIndex:'confine'}
    //{header:'操作',dataIndex:'state',renderer:renderOperate}
]);
var grid = new Ext.grid.EditorGridPanel({
    title:'工单积压监控统计',
    cm:cm,
    store:chartStore,
    sm : new Ext.grid.RowSelectionModel({
        singleSelect : true
    }),
    stripeRows:true,
    loadMask:true,
    clicksToEdit : 2,//双击触发,
    enableColumnMove : false,
    trackMouseOver : false,
    stripeRows:true,
    frame:true,

    loadMask:{
        msg:"数据加载中....."
    },
    viewConfig:{
        forceFit:true,
        columnsText:'显示列',
        scrollOffset:25,
        sortAscText:'升序',
        sortDescText:'降序'
    },
    autoExpandColumn:'desc',
    bbar:new Ext.PagingToolbar({
        pageSize:24,
        store:chartStore,
        displayInfo:true,
        displayMsg:'显示第 {0} 条到第 {1} 条记录,总共 {2} 条',
        emptyMsg:'无记录'

    }),
    viewConfig:{forceFit:true,sortAscText:'正序',sortDescText:'降序',
        getRowClass : function(record,rowIndex,rowParams,store){ 
            if(record.data.bill>=record.data.confine){
                return 'x-grid-back-red';
            }

        }
    }

});

var linechart = new Ext.chart.LineChart({
title:'工单积压图表',

xtype:'linechart',
url: AIUPP_ROOT+'/css/resources/charts.swf',
store:chartStore,
//xField: 'label',
//yField:'alarmCount',
//定义tip内容
tipRenderer : function(chart, record){
//alert(record.get('startTime'));
var ne = record.get('ne');
var str = String.format('网元:{0}\n工单量:{1}\n阀值:{2}',ne,record.get('bill'),record.get('confine'))
return str;
},
//定义两个图表,一个是柱状图,一个是折线图
series: [{
type: 'column',
displayName: '工单个数',
id:"billId",
xField: 'ne',
yField: 'bill',
style: {
color:0x99BBE8,
size: 20
}
},{
type:'column',
displayName: '阀值',
xField: 'ne',
yField: 'confine',
style: {
color: '#ff0000',
size: 20
}
}],
listeners:{
"show":function(){
var c = linechart.series;
//alert(c[1].store);
//c[1].style.color='#00ff00';

                }
            },
        //定义图表样式
        chartStyle: {

          legend:{
            display: "top"
          },
          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}
          }
        }

});

var contentPanel = new Ext.TabPanel({     
    region:'center',     
    enableTabScroll:true,     
    activeTab:0, 
    closable:false,
    split : false,
   collapsible : false,
    layoutOnTabChange:true,
    items:[linechart,grid]    

});

// 间隔时间
var interval = new Ext.form.TextField({
    name:'interval',
    fieldLabel:'间隔时间',
    id:"searchInterval"

});
// 分组方式
var groupType = new Ext.form.RadioGroup({
    name:'groupType',
    fieldLabel:'分组方式',
    id:"searchGroupType",
    items:[
        new Ext.form.Radio({
            name:"groupType",
            inputValue:"1",
            boxLabel:"地区"
        }),
        new Ext.form.Radio({
            name:"groupType",
            inputValue:"2",
            boxLabel:"地区+网元"
        }),
        new Ext.form.Radio({
            name:"groupType",
            inputValue:"3",
            boxLabel:"地区+网元+业务代码"
        })
    ]
});
// 开始按钮
var startBtn = new Ext.Button({
    text:'开始',
    minWidth:80,
    handler:function(){
        //store.load();
    }
});
// 停止按钮
var stopBtn = new Ext.Button({
    text:'停止',
    minWidth:80,
    handler:function(){
        //store.load();
    }
});
var searchPanel = new Ext.form.FormPanel({
    labelAlign:'left',
    labelWidth:60,
    frame:true,
    layout:'column',
    items:[
        {columnWidth:.28,layout:'form',items:[interval]},
        {columnWidth:.38,layout:'form',items:[groupType]},
        {columnWidth:.10,layout:'form',items:[startBtn]},
        {columnWidth:.16,layout:'form',items:[stopBtn]}
    ]
});
var vp = new Ext.Viewport({
    layout:'border',
    border:false,
    hideBorders:true,
    bufferResize:100,
    items:[
        //{region:'north',title:'::监控条件',autoHeight:true,margins:'5 5 10 5',collapsible:true,items:[searchPanel]},
        {region:'center',layout:'fit',margins:'5 5 5 5',items:[contentPanel]}
    ]
});

vp.show();

});
[/code]

Answer 1

改动不了

这个跟flash里的组件 已经绑得比较固定了，

除非你修改那个flash组件

这里给你找了个修改flash源码的文章，你可以看看

http://rundog.iteye.com/blog/591496

不过我觉得你要真的改的话，还是比较难的。