Extjs 4：饼图显示来自商店的groupField

Posted 2023-02-22

【中文标题】Extjs 4：饼图显示来自商店的groupField

【英文标题】：Extjs 4: pie chart display groupField from store

【发布时间】：2012-08-29 15:30:34

【问题描述】：

我希望创建一个饼图来显示商店中的组字段。例如，如果我商店中的每个学生都有一个“年级”字段，我希望饼图显示每个年级学生的相对数量。这可能吗？或者饼图是否必须显示一个字段 我的商店：

Ext.define('AM.store.Users', 
    extend: 'Ext.data.Store',
    model: 'AM.model.User',
    data: [
        Name: 'derp', Grade: 'FR',
        Name: 'herp', Grade: 'SR',
                 ....
        Name: 'beavis', Grade: 'SR'
    ],
    groupField: 'Grade',
 );

我对图表的尝试：

Ext.define('AM.view.user.Chart' , 
    extend: 'Ext.chart.Chart',
    alias: 'widget.userchart',
    width: 500,
    height: 600,
    animate: true,
    store: 'Users',
    shadow: true,
    legend:  position: 'right',
    insetPadding: 25,
    series: [
            type: 'pie',
            angleField: 'PreReq',
            showInLegend: true,
            highlight: 
                    segment: 
                            margin: 20
                    
            
            animate: true
    ]
);

感谢任何提示！

【问题讨论】：

您可能应该遵循 Sencha 网站上的图表指南，然后查看其中一个与您的图表类型匹配的示例。

【参考方案1】：

在您的商店中，您可以使用过滤、排序和分组，然后动态地反映在您的图表中。您需要将结果分组为一系列数据以显示在图表中。

【讨论】：

谢谢！我的商店中有一个 groupField，但我无法告诉图表将其用作数据。我将做更多关于在饼图中显示 groupFields 的研究......