Серия и ось диаграммы Ext.js

Предположим, у меня есть некоторые данные, которые я хочу отобразить на гистограмме Ext.js, и я хочу, чтобы мои данные вращались вокруг пользовательского значения, например, «1,0» по оси Y (по сравнению с традиционным «0,0»).

Это означает, что на изображении ниже отрицательные значения представлены перевернутыми столбцами, я бы хотел, чтобы значения меньше «1,0» отображались в виде перевернутого столбца на диаграмме.

введите здесь описание изображения

Есть ли настройка, которую я могу установить для достижения этого? Если да, то будет ли это в серии и определении оси? Может сам график?

Код отображаемой диаграммы приведен ниже:

Ext.require('Ext.chart.*');
Ext.require(['Ext.Window', 'Ext.fx.target.Sprite', 'Ext.layout.container.Fit', 'Ext.window.MessageBox']);

Ext.define('CPI', {
    extend: 'Ext.data.Model',
    fields: [{
        name: 'ReportingPeriod',
        type: 'string'
    }, {
        name: 'CPI_P',
        type: 'decimal'
    }, {
        name: 'CPI_C',
        type: 'decimal'
    }]
});

var store1 = Ext.create('Ext.data.Store', {
    model: 'CPI',
    data: [{
        ReportingPeriod: 'Period1',
        CPI_P: '1.9',
        CPI_C: '1.2'
    }, {
        ReportingPeriod: 'Period2',
        CPI_P: '1.2',
        CPI_C: '1.1'
    }, {
        ReportingPeriod: 'Period3',
        CPI_P: '0.1',
        CPI_C: '0.5'
    }, {
        ReportingPeriod: 'Period4',
        CPI_P: '-0.5',
        CPI_C: '0.6'
    }, {
        ReportingPeriod: 'Period5',
        CPI_P: '-0.9',
        CPI_C: '0.8'
    }, {
        ReportingPeriod: 'Period6',
        CPI_P: '-1.0',
        CPI_C: '-0.6'
    }, {
        ReportingPeriod: 'Period7',
        CPI_P: '-1.1',
        CPI_C: '-0.7'
    }, {
        ReportingPeriod: 'Period8',
        CPI_P: '-1.5',
        CPI_C: '-0.8'
    }]
});

var chart = Ext.create('Ext.chart.Chart', {
    style: 'background:#fff',
    animate: true,
    theme: 'Category1',
    store: store1,
    width: 300,
    height: 300,
    renderTo: 'chart',
    axes: [{
        type: 'Numeric',
        position: 'left',
        fields: ['CPI_P', 'CPI_C'],
        title: 'CPI',
        grid: true
    }, {
        type: 'Category',
        position: 'bottom',
        fields: ['ReportingPeriod'],
        title: 'Reporting Period'
    }],
    series: [{
        type: 'column',
        axis: 'left',
        xField: 'ReportingPeriod',
        yField: 'CPI_P',
        markerConfig: {
            type: 'cross',
            size: 3
        }, 
        renderer: function(sprite, record, attr, index, store) {

                var value = (record.get('CPI_P') >> 2) % 2;
                var color = ['rgb(213, 70, 121)', 
                             'rgb(44, 153, 201)'
                             ][value];
                return Ext.apply(attr, {
                    fill: color
                });
            }
    }]
});

chart.show();

ОБНОВЛЕНИЕ

Если я добавлю минимум к оси Y, я стану ближе (вроде)

...
axes: [{
        type: 'Numeric',
        position: 'left',
        fields: ['CPI_P', 'CPI_C'],
        title: 'CPI',
        grid: true,
        minimum: 1,
    }....

введите здесь описание изображения

Это правильная идея, потому что столбцы теперь относятся к числу 1, но мне, очевидно, нужно сохранить столбцы на графике.


extjs sencha-charts
person wilsjd    schedule 19.03.2013    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Что, похоже, сработало, так это вычитание 1 из моих данных и добавление 1 к меткам.

axes: [{
            type: 'Numeric',
            position: 'left',
            grid: true,
            maximum: 1.0, //will render to 2.0
            fields: ['PeriodAmount', 'CumulativeAmount'],
            label:{
                renderer:function(v){
                    return (v+1).toFixed(2);
                }
            }         
        }...]

введите здесь описание изображения

Для меня это жизнеспособная работа, но я бы не считал это элегантным ответом, поскольку он не очень настраивается для пользовательских значений. Например, изменение этого параметра на -1 или 2 потребует больше усилий, чем простое изменение простой настройки.

person wilsjd    schedule 22.03.2013