extjs 创建多个实例

要创建多个 ExtJS 实例，你可以使用 `Ext.application` 方法来定义一个应用程序，并通过实现 `launch` 方法来创建多个实例。在 `launch` 方法中，你可以使用 `Ext.create` 方法来创建多个实例，如下所示：

Ext.application({
    name: 'MyApp',

    launch: function() {
        var instance1 = Ext.create('MyApp.MyClass');
        var instance2 = Ext.create('MyApp.MyClass');
        var instance3 = Ext.create('MyApp.MyClass');

        // do something with the instances...
    }
});

上面的代码定义了一个名为 `MyApp` 的应用程序，并在 `launch` 方法中创建了三个名为 `MyClass` 的实例。你可以根据需要修改 `MyApp` 和 `MyClass` 的名称来适应你的应用程序。

相关问题

extjs4 多层表头

在 ExtJS4 中，可以使用 Ext.grid.header.Container 和 Ext.grid.column.Column 类来实现多层表头。具体步骤如下：

1. 创建一个 Ext.grid.Panel 实例，并定义表格列的配置项。

2. 使用 Ext.grid.header.Container 类创建表头容器，设置容器的布局和样式。

3. 使用 Ext.grid.column.Column 类创建表头列，设置列的文字、宽度、数据域等属性。

4. 将表头列添加到表头容器中，并设置表头列的嵌套关系，即将子表头列添加到父表头列的子项中。

5. 将表头容器设置为表格的顶部工具栏，通过表格的 reconfigure 方法重新加载数据。

示例代码如下：

var grid = Ext.create('Ext.grid.Panel', {
    columns: [
        {
            text: 'Group 1',
            columns: [
                { text: 'Name', dataIndex: 'name', width: 100 },
                { text: 'Age', dataIndex: 'age', width: 50 }
            ]
        },
        {
            text: 'Group 2',
            columns: [
                { text: 'City', dataIndex: 'city', width: 100 },
                { text: 'Country', dataIndex: 'country', width: 100 }
            ]
        }
    ],
    store: store,
    tbar: {
        xtype: 'headercontainer',
        items: [
            {
                xtype: 'gridcolumn',
                text: 'Group 1',
                columns: [
                    { text: 'Name', dataIndex: 'name', width: 100 },
                    { text: 'Age', dataIndex: 'age', width: 50 }
                ]
            },
            {
                xtype: 'gridcolumn',
                text: 'Group 2',
                columns: [
                    { text: 'City', dataIndex: 'city', width: 100 },
                    { text: 'Country', dataIndex: 'country', width: 100 }
                ]
            }
        ]
    },
    height: 200,
    width: 400,
    renderTo: Ext.getBody()
});

其中，store 是数据源，可以使用 Ext.data.Store 类创建。在这个示例中，表头容器使用了 Ext.grid.header.Container 类，并且设置了 xtype 为 'headercontainer'，表头列使用了 Ext.grid.column.Column 类，并且设置了 xtype 为 'gridcolumn'。表头列的嵌套关系通过 columns 属性实现。最后，表头容器作为表格的顶部工具栏，通过 tbar 属性设置。

extjs 画多列柱状图

好的，您可以使用 ExtJS 中的 `Ext.chart.series.Bar` 类来创建多列柱状图。以下是一个示例代码，展示如何在 ExtJS 中创建一个多列柱状图：

Ext.create('Ext.chart.Chart', {
    renderTo: Ext.getBody(),
    width: 400,
    height: 300,
    store: {
        fields: ['name', 'data1', 'data2', 'data3'],
        data: [
            { name: 'A', data1: 10, data2: 20, data3: 30 },
            { name: 'B', data1: 20, data2: 30, data3: 40 },
            { name: 'C', data1: 30, data2: 40, data3: 50 },
            { name: 'D', data1: 40, data2: 50, data3: 60 }
        ]
    },
    axes: [
        {
            type: 'numeric',
            position: 'left',
            fields: ['data1', 'data2', 'data3'],
            title: '数值',
            grid: true,
            minimum: 0
        },
        {
            type: 'category',
            position: 'bottom',
            fields: ['name'],
            title: '类别'
        }
    ],
    series: [
        {
            type: 'bar',
            xField: 'name',
            yField: ['data1', 'data2', 'data3'],
            stacked: false,
            title: ['数据1', '数据2', '数据3'],
            style: {
                opacity: 0.80
            },
            highlight: {
                fillStyle: 'yellow'
            },
            tooltip: {
                trackMouse: true,
                renderer: function (tooltip, record, item) {
                    tooltip.setHtml(record.get('name') + ': ' + item.field + ' = ' + record.get(item.field));
                }
            }
        }
    ]
});

在上面的代码中，我们首先创建了一个 `Ext.chart.Chart` 实例，并将其渲染到页面的 `body` 元素中。然后，我们定义了一个数据源，其中包含了每个类别的三个数据列。接下来，我们定义了两个坐标轴：一个是数值轴，用于显示数据列的值；另一个是类别轴，用于显示类别名称。最后，我们定义了一个柱状图系列，其中 `xField` 是类别名称，`yField` 是三个数据列名称的数组，`stacked` 属性设置为 `false`，因为我们不希望将数据列堆叠在一起。我们还设置了一些样式和工具提示，以便用户可以查看每个数据点的值。

请注意，您需要在 ExtJS 应用程序中加载 `Ext.chart.*` 和 `Ext.draw.*` 包，以便使用 ExtJS 的图表和绘图功能。