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?

Answer 1

Using column renderer you are able to affect rendering via metadata object.

Unfortunately, it allows changing html attributes and css classes only.
Therefore either you need to try using css styles for chart generation or search for other ways possible, like creating ad hoc columns.