Geek Answers Handbook

Timeline ExtJs charts, update issue

I am using Ext4 js to create diagrams. My charts are line charts showing the evolution of events over time, so my bottom axes are time axes:

    {
    type: 'Time',
    position: 'bottom',
    grid: grid,
    fields: 'name',
    title: false,
    dateFormat: 'd/m/y',
    groupBy: 'year,month,day',

    aggregateOp: 'sum',
    label: {
        orientation: 'horizontal',
        rotate: {
            degrees: label_rotation
        }
    }

I have links to zoom. Clicking on one of these links should change the dateformat and groupby options. Here is the code:

scaleGroups = {
    'DAY': {
    dateFormat: 'd/m/y',
        groupBy: 'year,month,day' 
    },
    'MONTH' :{
            dateFormat: 'M Y',
            groupBy: 'year,month'
    },
    'YEAR' :{
            dateFormat: 'Y',
            groupBy: 'year'
    }
};


function changeChartScale(chart_id, scale) {
    var chart = Ext.getCmp(chart_id);
    var axis = chart.axes.get(1);
    selectedGroup = scaleGroups[scale];
    axis.dateFormat = selectedGroup.dateFormat;
    axis.groupBy = selectedGroup.groupBy;

    chart.redraw();
}

The problem is that the transition from the scale to another, for example from days to several months, remains the same. So, the line is correct, but I see both daily marks and month marks.

Does anyone know why?

Thanks in advance, Sabrina

UPDATE 06/06/2011 : The same code on a sample html page importing only this javascript library works.

, javascript, (JQuery, googlempas...). - ?

+5
3

, chart.redraw() / .

, axis.drawAxis() ...

, .

    chart.axes.items[0].fields = [column.dataIndex];
    chart.series.items[0].yField = [column.dataIndex];


    var s = Ext.data.StoreManager.lookup('myStore');
    var max = s.max(column.dataIndex);


    chart.axes.items[0].maximum = max;
    chart.axes.items[0].drawAxis();


    chart.redraw();
+5

, ! (.. , 31, , 12). !

+1

More articles:


All Articles