How can I creat a bar in a cell of a Grid (ExtJS 3.3.1)

Question

I have a grid that has an associated JsonStore and everything is populating great. I want to create in a column something like this:

I am very new to Ext, but this is what I have so far in my ColumnModel:

     {
        header: 'Sales Rep', 
        width: 150, 
        sortable: true, 
        dataIndex: 'salesrep'
     },
     {
        header: 'graph',
        width: 150,          
        sortable: true, 
        dataIndex: 'ytd',
        renderer: function(value, metaData, record, rowIndex, colIndex, store){
            var colChart = new Ext.chart.ColumnChart({
                store: store,
                xField: 'ytd',
                yField: 'salesrep'           
            });             
        }            
     },
     {
        header: 'Year to Date', 
        width: 150, 
        sortable: true, 
        dataIndex: 'ytd'
     }, 

The first and third column work as expected, but I am not seeing anything in the second. Anyone done anything like this?