私は今extjs 4を使用しています。Ext.chart.axis.Category
です。extjs4:各単語のカスタム軸ラベルへの方法
しかし、どのように各単語のラベルをカスタマイズしますか?
私は、軸の下にあるラベルに72個の数字があります。太字24と48だけが必要です。
Ext.chart.Label
を確認しましたが、renderer
という便利な機能があります。しかし、テキストの変更にのみ使用され、スタイルの変更には使用されません。
私の例のコードスニペット:あなたが必要として
{
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'
}
]
}
私はすでに ''のようなコードを試してみたが、それは動作しません。たぶんそれはSVGを使っているからですが、私はSVGについて何も知りません。 – liuyanghejerry