在 extjs4 mvc 框架中扩展图表类会导致“配置未定义”

Question

我想扩展图表类以在视图中使用，作为 extjs4 MVC 框架的一部分。我在 firebug 中收到此错误：

config is undefined 
[Break On This Error] me.initTheme(config.theme || me.theme);
Chart....8936564 (line 191)

这是类定义：

Ext.define('CDR.chart.Daily', {
alias: 'widget.dailychart',
extend: 'Ext.chart.Chart',    
initComponent: function() {
    Ext.apply(this, {
        id: 'daily',
        insetPadding: 30,

     ... irrelevant code cut .......

    });          
    this.callParent(arguments);
  }
});

这是图表添加到的视图类：

Ext.define('CDR.view.trunk.View', {
alias: 'widget.trunkview',
extend: 'Ext.panel.Panel',    
requires: [
    'CDR.chart.Daily'
],        
initComponent: function() {
    Ext.apply(this, {
        id        : 'itemCt',
        border    : false,
        autoScroll: true,
        layout: {
            type : 'hbox',
        },            
        items: [
            Ext.create('CDR.chart.Daily'),
            {
                id    : 'contentCt',
                width : 500,
                border: false
            }
        ]
    });                
    this.callParent(arguments);
  }    
});

Answer 1

我认为这是一个错误，因为默认情况下“主题”应该具有“基本”值，但没有。
来自 Chart.js 的源代码：

/**
 * @cfg {String} theme (optional) The name of the theme to be used. A theme defines the colors and
 * other visual displays of tick marks on axis, text, title text, line colors, marker colors and styles, etc.
 * Possible theme values are 'Base', 'Green', 'Sky', 'Red', 'Purple', 'Blue', 'Yellow' and also six category themes
 * 'Category1' to 'Category6'. Default value is 'Base'.
 */

因此，只需将以下代码添加到您的新类中：

constructor: function() {
    this.callParent([{theme: 'Category1'}]);
},

它对我有用。

Answer 2

我也有类似的问题，但不是针对配置对象，而是针对基本主题，对于您的问题，首先您可以更正面板的 items 属性，而不是

 items: [
        Ext.create('CDR.chart.Daily'),

它应该是

items：[
{ Ext.create('CDR.chart.Daily'),....}

另外，如果您使用的是 MVC 框架，请确保在 app.js 中的 Ext.require 部分中添加了以下行：

'Ext.chart.theme.Base',
'Ext.chart.theme.Theme',