PDA

View Full Version : Can we control step size in charts?



SergSt
7 Dec 2011, 11:40 PM
Below is a simple example, what i'd like to have is a way to control step size between ticks.
Say, define an arbitrary value for a step(1 or 5 or whatever user feels more suitable in his particular case).
Looks that such calculations now sort of "predefined" in Ext.Draw.draw.snapEnds,
but may be anyone found a suitable and not too much 'hackish'(i mean, some other then overriding private methods) way to let user decide step-related stuff..




var store_example1 = Ext.create('Ext.data.JsonStore', {
fields: ['x_data', 'y_data1'],
data: [
{'x_data':0, 'y_data1':3},
{'x_data':1, 'y_data1':7},
{'x_data':2, 'y_data1':37},
{'x_data':3, 'y_data1':17},
{'x_data':4, 'y_data1':24}
]
});

var example1_linechart_cf = {
xtype : 'chart',
store : store_example1,
axes : [
{
type: 'Numeric',
position : 'left',
fields : ['y_data1'],
grid : true,
title : 'Y-measure',
minimum : 0,
adjustMinimumByMajorUnit: 0,
label : {
renderer : Ext.util.Format.numberRenderer('0.0'),
}
},
{
type : 'Numeric',
position : 'bottom',
fields : ['x_data'],
title : 'X-measure',
label : {
renderer : Ext.util.Format.numberRenderer('0.0'),
rotate : {
degrees : -15
}
}
}],
series : [{
type : 'line',
xField : 'x_data',
yField : ['y_data1'],
smooth : true,
fill : true,
showMarkers : true
}],
listeners : {
beforerefresh : function(chart, options) {
}
}
}, example1_linechart = new Ext.chart.Chart(example1_linechart_cf);

var my_win = new Ext.window.Window({
width : '70%',
height : '80%',
minWidth : 550,
minHeight : 300,
layout : 'fit',
collapsible : true,
title : 'Example 1',
items : example1_linechart,
renderTo : Ext.getBody()
});
my_win.show();

tobiu
8 Dec 2011, 5:01 AM
take a look at:
http://docs.sencha.com/ext-js/4-0/#!/api/Ext.chart.axis.Axis

majorTickSteps
minorTickSteps

SergSt
8 Dec 2011, 7:55 AM
take a look at:
majorTickSteps
minorTickSteps
thanks for response, tobiu
but major/minor TickSteps controls (to some degree, cause they still might be adjusted by Ext internals) number of ticks/steps, they do nothing about size of step.
And we can't control size of step even with some derivative, like setting majorTickSteps so that (max/majorTickSteps) = desired step size.
Taking example above, what majorTickSteps should i use to have step size 2.5 ?

P.S. Looking into internals, in Ext.draw.Draw.snapEnds step initially calculated in straightforward way:

step = (to - from) / stepsMax
but then a bit of magic added:

step = Math.floor(step * Math.pow(10, -level)) * Math.pow(10, level) + topValue * Math.pow(10, level - 2);
to have step size in more human-friendly way out-of-box, i suppose.
Have a control over tick numbers is cool, but have a choice to control either number of ticks OR size step is even better :)

Or you can suggest a way to have a precise control over step size with majorTickSteps ?