title: Sencha Chart not showing in view
body: <p>At the top of my view, I have defined the following variable:</p>
  
  <pre><code>      var chartq = new Ext.chart.Chart({
        renderTo : Ext.getBody(), 
        xtype: 'chart',
        animate: true,
          width : 400,
          height : 300,
          store: {
              fields: ['name', 'data1', 'data2', 'data3', 'data4', 'data5'],
              data: [{
                  'name': 'metric one',
                  'data1': 10,
                  'data2': 12,
                  'data3': 14,
                  'data4': 8,
                  'data5': 13
              }, {
                  'name': 'metric two',
                  'data1': 7,
                  'data2': 8,
                  'data3': 16,
                  'data4': 10,
                  'data5': 3
              }, {
                  'name': 'metric three',
                  'data1': 5,
                  'data2': 2,
                  'data3': 14,
                  'data4': 12,
                  'data5': 7
              }, {
                  'name': 'metric four',
                  'data1': 2,
                  'data2': 14,
                  'data3': 6,
                  'data4': 1,
                  'data5': 23
              }, {
                  'name': 'metric five',
                  'data1': 27,
                  'data2': 38,
                  'data3': 36,
                  'data4': 13,
                  'data5': 33
              }]
          },
          axes: [{
              type: 'numeric',
              position: 'left',
              title: {
                  text: 'Sample Values',
                  fontSize: 15
              },
              fields: 'data1'
          }, {
              type: 'category',
              position: 'bottom',
              title: {
                  text: 'Sample Values',
                  fontSize: 15
              },
              fields: 'name'
          }],
          series: [{
              type: 'bar',
              xField: 'name',
              yField: 'data1',
              style: {
                  fill: 'blue'
              }
          }]
      });
  
  
  Ext.define('axis3.view.Chart', {
  
      extend: 'Ext.Panel',
      requires: ['Ext.TitleBar'],
      alias: 'widget.chartview',
      getSlideLeftTransition: function () {
          return { type: 'slide', direction: 'left' };
      },
  
      getSlideRightTransition: function () {
          return { type: 'slide', direction: 'right' };
      },
      config: {
          layout: {
              type: 'fit'
          },
          items: [{
                      xtype : 'label',
                      html : 'Some label.'
                          },
                  {
                      xtype: 'container',
                      flex: 1,
                      items:chartq  //Ext.chart.Chart 
                },
                {
                      xtype: 'toolbar',
                      docked: 'bottom',
                  },
                  {
              xtype: 'titlebar',
              title: 'Axis First Stats App',
              docked: 'top',
  
  
              items: [
                  {
                      xtype: 'button',
                      text: 'Log Off',
                      itemId: 'logOffButton',
                      align: 'right'
                  },
                   {
                      xtype: 'button',
                      text: 'Back',
                      itemId: 'backButton',
                      align: 'left'
                  },
  
              ],
  
          }],
          html: [
                      '&lt;div id="localuid"&gt;Signed in Uid: &lt;span&gt;'+localStorage.uid+'&lt;/span&gt;&lt;/div&gt;'
                  ].join(""),
  
          listeners: [{
              delegate: '#logOffButton',
              event: 'tap',
              fn: 'onLogOffButtonTap'
          },{
              delegate: '#backButton',
              event: 'tap',
              fn: 'onBacktButtonTap'
          }]
      },
      onLogOffButtonTap: function () {
          localStorage.clear();
          window.location.reload();
      },
      onBackButtonTap: function () {
  
      Ext.create('axis3.view.Main',{});
       Ext.Viewport.animateActiveItem('mainview', this.getSlideRightTransition());
      },
  
  });
  </code></pre>
  
  <p>The view becomes active as expected when a button in the toolbar is pressed. But, the chart is not visible. No errors are shown in console log. I have tried adding the variable to the config and to the 'items', but the chart still does not show. No errors in console.log</p>
  
  <p>The container for the chart is being created in the browser as expected - just no graph appearing</p>
  
  <p>Can someone please tell me what I am missing?</p>