如何在Extjs5中更改条形图的标签

How to change the label of bar chart in Extjs5?

本文关键字:条形图 标签 Extjs5      更新时间:2023-09-26

这是关于ExtJs5图表的内容。更改条形图的标签时遇到问题。

代码如下:

Ext.create('Ext.chart.CartesianChart', {
        store: {
            fields: ['pet', 'households', 'total'],
            data: [{
                pet: {name:'Cats'},
                households: 38,
                total: 93
            }]
        },
        axes: [{
            type: 'numeric',
            position: 'left'
        }, {
            type: 'category',
            position: 'bottom'
        }],
        series: [{
            type: 'bar',
            xField: 'pet',
            yField: 'households',
            label:{
                field:'pet',
                renderer:function(pet){
                    return 'Dear '+pet.name;
                }
            }
        }]
    });

您一定注意到字段"pet"是一个对象,而不是字符串。系列标签中的渲染器返回我想要的值,但标签仍然是[object object]!

类别(代码中的x轴)下的标签由"类别"而非系列呈现。尝试以下代码:

{
   type: 'category',
   position: 'bottom',
   renderer:function(label){
     return label.name;//the var 'label' represents the pet object.
   }
}

顺便说一下,我发现了另一个问题。无论图表存储中有多少个模型,都只显示第一个条形图!