PDA

View Full Version : change type chart (columns to lines)



pancho.munyoz
31 Jan 2013, 12:14 PM
I have a chart type 'colums'

41594

When i select line button, i want change chart type to Line, but i canīt...
any idea how i do?

Farish
1 Feb 2013, 1:28 AM
I am not sure if its possible to dynamically change the series of a chart. I have one possible solution which is to use card layout for a parent panel and create 2 charts (line and column) and place them inside this parent panel. Then you may change the active view of the parent panel when the toolbar button is clicked. Here is a sample:


Ext.onReady(function() {
Ext.create('Ext.data.Store', {
storeId:'simpsonsStore',
fields:['name', 'email', 'phone'],
data:{'items':[
{ 'name': 'Lisa', "email":"lisa@simpsons.com", "phone":"555-111-1224" },
{ 'name': 'Bart', "email":"bart@simpsons.com", "phone":"555-222-1234" },
{ 'name': 'Homer', "email":"home@simpsons.com", "phone":"555-222-1244" },
{ 'name': 'Marge', "email":"marge@simpsons.com", "phone":"555-222-1254" }
]},
proxy: {
type: 'memory',
reader: {
type: 'json',
root: 'items'
}
}
});

var grid1 = Ext.create('Ext.grid.Panel', {
title: 'Line',
store: Ext.data.StoreManager.lookup('simpsonsStore'),
columns: [
{ header: 'Name', dataIndex: 'name' },
{ header: 'Email', dataIndex: 'email', flex: 1 },
{ header: 'Phone', dataIndex: 'phone' }
]
});

var grid2 = Ext.create('Ext.grid.Panel', {
title: 'Column',
store: Ext.data.StoreManager.lookup('simpsonsStore'),
columns: [
{ header: 'Name', dataIndex: 'name' },
{ header: 'Email', dataIndex: 'email', flex: 1 },
{ header: 'Phone', dataIndex: 'phone' }
]
});

var parent = Ext.create('Ext.panel.Panel', {
//title: 'Parent',
layout: 'card',
width: 400,
height: 400,
renderTo: Ext.getBody(),
items: [grid1, grid2], // place the 2 charts here
dockedItems: [{
xtype: 'toolbar',
dock: 'bottom',
items:
[
{text: 'Line', handler: function() {parent.getLayout().setActiveItem(grid1);} },
{text: 'Column', handler: function() {parent.getLayout().setActiveItem(grid2);} }
]
}]
});
});

pancho.munyoz
1 Feb 2013, 5:17 AM
I using MVC architecture...
my series are dynamic