View Full Version : Column chart with 2 Y axes

14 Feb 2012, 7:08 AM

I'm trying to plot a column chart with 2 series and thus 2 Y axis, one in the left side and the other in the right side. But the columns display in the same place, on top of each others and not side by side. Do you have any idea how to fix this ?


14 Feb 2012, 8:10 AM
Instead of two series, try specifying yField as an array:

yField: ['data1', 'data2']

14 Feb 2012, 8:15 AM
I just tried but it doesnt work neither. The problem is when I try with 2 series, I actually have 2 series drawn, but they are drawn on top of each others, so one is hiding the other.

14 Feb 2012, 8:18 AM
I just tried that line of code in the column example of the touch charts and it worked as I would expect it. Each month had two columns next to each other.

14 Feb 2012, 8:22 AM
Can you show me the full code you tried please ?

14 Feb 2012, 8:33 AM
If you open the column example, scroll down and replace the yField with that array

14 Feb 2012, 8:45 AM
Yes what you said works, but what I'm trying to do is something like that :

Ext.onReady(function () {
var chart;

chart = new Ext.chart.Chart({
width: 800,
height: 600,
animate: true,
store: store1,
renderTo: Ext.getBody(),
shadow: true,
axes: [{
type: 'Numeric',
position: 'left',
fields: ['data1'],
label: {
renderer: Ext.util.Format.numberRenderer('0,0')
title: 'Number of Hits',
grid: true,
minimum: 0
}, {
type: 'Category',
position: 'bottom',
fields: ['name'],
title: 'Month of the Year'
}, {
type: 'Numeric',
position: 'right',
fields: ['data2'],
title: 'Test'
series: [{
type: 'column',
axis: 'left',
highlight: true,
xField: 'name',
yField: 'data1'
}, {
type: 'column',
axis: 'right',
xField: 'name',
yField: 'data2'

Something with a right axis and a serie linked to this axis.

14 Feb 2012, 8:48 AM
What you want is two columns side by side for one name correct? Using the yField as an array does just that.

14 Feb 2012, 8:50 AM
Yeah but I want one of them linked to the right axis, so I can have two different scales.

24 May 2012, 2:25 AM
Hi, Trexx
did you got the solution of the same as i m looking for the same thing

24 May 2012, 3:49 AM
I made an hack to make it works the way I wanted. Contact me if you want me to help you with it : ravey [dot] matt [at] gmail [dot] com

28 May 2012, 9:18 PM
here is the solution from the problem of multiple -y axis, its more like a hack but works perfectly..



19 Aug 2015, 8:54 PM
Looks as though you never got answered after that.

Yeah but I want one of them linked to the right axis, so I can have two different scales.

21 Mar 2017, 10:48 AM
Having the same problem with Extjs5.0.1.
Would appreciate some input regarding this @mitchellsimoens (https://www.sencha.com/forum/member.php?22216-mitchellsimoens)