extjs4 : how to custom axis label in each word - extjs

Question

I'm using extjs 4 now, with its Ext.chart.axis.Category.
But how to custom the label in each word?
Say, I have 72 numbers in the label at the bottom of the axis, and I want bold 24 and 48 only.
I've checked the Ext.chart.Label, and did found there's a useful function called renderer. But it is only used for text change, not a style change.
My example code snippet:
{
xtype: 'chart',
id: 'monitorAmmeter72chart',
animate: false,
region: 'center',
store:Ext.data.StoreManager.lookup('monitorAmmeter72Store'),
axes: [
{
type: 'Category',
fields: ['hourDis'],
position: 'bottom',
title: 'blablabla',
grid: true,
label:{
renderer:function(v){
if(v == '24'){
return '<b>24</b>';//Note, this won't work.
}else{
return v;
}
}
}
},
{
type: 'Numeric',
fields: ['data'],
position: 'left',
title: 'another blablabla',
grid: true,
minimum: 0
}
],
series: [
{
type: 'column',
axis: 'left',
highlight: false,
tips: {
trackMouse: false,
width: 50,
height: 28,
renderer: function(storeItem, item) {
this.setTitle(storeItem.get('data') + ' xx');
}
},
style: {
fill: '#38B8BF'
},
gutter: 20,
xField: 'hour',
yField: 'data'
}
]
}

Answer 1

i'm using extjs 4.2.1 and i'm doing :
label: {
renderer: function(v) {
if(v == 'Capitale-Nationale'){
this.font = "bold 12px Arial, Helvetica, sans-serif";
this.padding = 5;
}
else{
this.font = "12px Arial, Helvetica, sans-serif";
this.padding = 5;
}
return v;
}
},

Answer 2

You could actually create a HTML string in the renderer and style it as you need. Isn't it an option?