2011-06-23 49 views
1

我试图使用ext-all-sandbox.js将Ext4图表添加到现有的Ext3应用程序中。我有基本的工作,但下面的代码给出axis.processView is not a function。它没有定义的轴工作正常(但没有明显的轴)。在ExtJS 3应用程序中使用ExtJS 4图表

似乎配置对象被直接使用,而不是用于创建实际的轴实例。任何解决方案,让这个工作?

TestGraphPanel = Ext.extend(Ext.Panel, { 
    initComponent: function() { 
     TestGraphPanel.superclass.initComponent.call(this); 

     Ext4.define('DataPoint', { 
      extend: 'Ext.data.Model', 
      fields: ['xValue', 'yValue'] 
     }); 

     this.store = Ext4.create('Ext.data.Store', { 
      model: 'DataPoint', 
      data: [ 
       {xValue: 0, yValue: 2}, 
       {xValue: 1, yValue: 4}, 
       {xValue: 2, yValue: 7}, 
       {xValue: 3, yValue: 5}, 
       {xValue: 4, yValue: 8}, 
       {xValue: 5, yValue: 9} 
      ] 
     }); 
    }, 

    afterRender: function() { 
     Ext4.create('Ext.chart.Chart', { 
      renderTo: this.body.dom, 
      width: this.ownerCt.getWidth(), 
      height: this.ownerCt.getHeight(), 
      store: this.store, 
      axes: [ 
       { 
        title: 'x', 
        type: 'Numeric', 
        postition: 'bottom', 
        fields: ['xValue'] 
       }, 
       { 
        title: 'y', 
        type: 'Numeric', 
        position: 'left', 
        fields: ['yValue'] 
       } 
      ], 
      series: [ 
       { 
        type: 'line', 
        xField: 'xValue', 
        yField: 'yValue' 
       } 
      ] 
     }); 
    } 
}); 

回答

0

快速查看源代码后,我认为您的问题可能来自您在afterRender中创建图表。

我特别

//process all views (aggregated data etc) on stores 
//before rendering. 
me.axes.each(function(axis) { 
    axis.processView(); 
}); 

的配置对象之前被解析想着那些线条。否则,尝试在那里设置断点并检查对象。

+0

你的意思是创建图表,只调用afterRender中的chart.render()? – OrangeDog

+0

由于你配置了renderTo我不确定你需要调用渲染明确,但是基本上是。 – Jad

+0

那么renderTo将需要肯定删除,否则它会尝试在div存在之前呈现。 – OrangeDog