Get view (chart) item from controller

Question

I have a chart with a text item :

 Ext.define('MyProject.view.DrawChart', {
   extend: 'Ext.chart.Chart',
   alias: 'widget.drawchart',
   requires: ['Ext.chart.*', 'Ext.data.*', 'Ext.layout.container.Fit'],
   default chart settings here

    ...

   items: [{
      type  : 'text',
      text  : 'Simple Title',
      font  : '14px Arial',
      id : 'chartTitle',
      width : 100,
      height: 30,
      x : 50, //the sprite x position
      y : 10  //the sprite y position
   }]
})

I need to customize the text property of that item from the controller. How can I access or reference that item? I have tried the usual reference :

this.getDrawChart().down('text #chartTitle').title

Nothing works! Any help would be appreciated.

Answer 1

Use:

Ext.getCmp('chartTitle');

Where chartTitle is the id of the element.

Once you got an element you can use .getCls(), .setCls() and .addCls() or .removeCls() to get, set or add CSS classes.

Like:

var title = Ext.getCmp('chartTitle');
title.addCls('newStyle');