ExtJS PieChart饼图

最新推荐文章于 2024-06-12 09:58:22 发布

绿苹果果

最新推荐文章于 2024-06-12 09:58:22 发布

阅读量6.2k

点赞数 2

分类专栏： ExtJs 文章标签： sencha architect extjs 饼图

本文链接：https://blog.csdn.net/dongshaoshuai/article/details/38407895

版权

本文详细介绍了如何在Sencha Architect中创建ExtJS PieChart饼图。内容涵盖从Json文件的创建，到数据store的配置，再到图表属性的设定和最终代码实现，同时提供了饼图的预览以及如何添加保存按钮的操作步骤。

摘要由CSDN通过智能技术生成

Json文件：

data1.json:

1 创建Pie Chart

往panel内拖入一个Pie Chart

2 store

创建store，url指定为data1.json，添加name和data1字段，sencha architect自动生成的代码：

Ext.define('MyApp10.store.PieChart', {
    extend: 'Ext.data.Store',

    requires: [
        'Ext.data.proxy.Ajax',
        'Ext.data.reader.Json',
        'Ext.data.Field'
    ],

    constructor: function(cfg) {
        var me = this;
        cfg = cfg || {};
        me.callParent([Ext.apply({
            autoLoad: true,
            autoSync: true,
            storeId: 'PieChart',
            proxy: {
                type: 'ajax',
                url: 'data/chart/data1.json',
                reader: {
                    type: 'json'
                }
            },
            fields: [
                {
                    name: 'name'
                },
                {
                    name: 'data1'
                }
            ]
        }, cfg)]);
    }
});