Panel item hide/show

[sandeepmnit35]

I have a panel with 2 item and I want to hide/show them on the basis of requirement. Below is the code:
[HTML]
Ext.define('RA.view.Panel1', {
extend: 'Ext.Panel',
xtype: 'panel1',
requires: [
'Ext.chart.Panel'
],
config: {
id: 'Panel1',
layout: {type: 'vbox', pack: 'center'},
flex: 1,
style: "background-color: black; color:white",
items: [
{
xtype: 'chart',
hidden:true,
id: 'chart1',
//html: "<h1 style = 'color: red'>To configure this chart, tap this panel, click Settings to select axes, chart type, granularity, etc., then click Select Dates to select start and end dates.</h1>"
},

{
xtype: 'button',
html: 'Add chart',
ui: 'confirm',
id:'chart1Button',
style: 'font-size: 14px; margin-left: 560px; margin-right: 560px; margin-top: 5px; margin-bottom: 5px;',
},
]
}
});/HTML]

I tried Ext.getCmp('Panel1') method to get the panel but it is returning null.

Please let me know how can I hide/show the item of this panel.
Any kind of help will be amazing.
Thanks

[mitchellsimoens]

Where are you doing the

Ext.getCmp('Panel1')

If it returns null, an instance hasn't been created yet.