[4.1 Beta 3] Grouped Bar charts: Incorrect values shown in series labels

[lukesen]

[4.1 Beta 3] Grouped Bar charts: Incorrect values shown in series labels when not all series are shown.

Note: For lack of a better term, I call them "multiple series", even though in Ext JS a single series object, with yField configured as an array of field names (rather than a single field name, as described in the documentation), will generate all of them. In Ext JS Examples, this configuration is called a "Grouped Bar chart".

REQUIRED INFORMATION
Ext version tested:

• Ext 4.1 Beta 3

Browser versions tested against:

• Chrome 17, IE 9, FF10 (issue is not browser specific)

Description:
In a chart with multiple Column or Bar series, when labels are shown in the series, incorrect values will be displayed when not all series are shown. To selectively show/hide series in the chart, make sure the Legend is displayed, and simply click on the Legend items.

Steps to reproduce the problem:

1. Set up a chart with two or more Bar series (technically a chart set up with a series config array with a single series item, which in turn has the yField property set to an array of field names - as in the code below), with labels shown in the series (label config object set up, such that each bar/column in the chart will display its value), and with the Legend visible (chart's legend config object set up).
2. When the chart is displayed, click the Legend items to hide/show individual series and watch the values displayed in the chart.
3. The easiest way to spot the problem is to hide all series except one, and check if the values displayed for each series in turn are correct.

The result that was expected:

• Each series should display the correct values, regardless whether all series are shown or only a subset.

The results that occurs instead:

• Always the values from the first series are displayed, whenever a single series (either of them) is shown.
• When multiple series are displayed (but not all) the results vary:
  • If the first few series are shown, and the last few ones are hidden, the displayed series will show correct values.
  • However, if the first series (or some middle ones) are hidden, then for some series values may be missing, or "undefined" etc.
• When the labels are shown outside the bars (as in the code below), when a series is hidden, sometimes text remains behind (and only gets cleaned up when all series get hidden). [This is a bug I saw reported already].

Test Case:

var store = Ext.create('Ext.data.JsonStore', {
    fields: ['name', 'data1', 'data2', 'data3', 'data4'],
    data: [
        { 'name': 'metric one',   'data1':10, 'data2':12, 'data3':14, 'data4':8 },
        { 'name': 'metric two',   'data1':7,  'data2':8,  'data3':16, 'data4':10 },
        { 'name': 'metric three', 'data1':5,  'data2':2,  'data3':14, 'data4':12 },
        { 'name': 'metric four',  'data1':2,  'data2':14, 'data3':6,  'data4':1 },
        { 'name': 'metric five',  'data1':27, 'data2':38, 'data3':36, 'data4':13 }
    ]
});

Ext.create('Ext.chart.Chart', {
    renderTo: Ext.getBody(),
    width: 500,
    height: 300,
    legend: {
      position: 'right'
    },
    store: store,
    axes: [{
        type: 'Numeric',
        position: 'left',
        grid: true,
        minimum: 0,
        maximum: 45
    }, {
        type: 'Category',
        position: 'bottom',
        fields: ['name']
    }],
    series: [{
        type: 'bar',
        column: true,
        axis: 'left',
        xField: 'name',
        yField: ['data1', 'data2', 'data3', 'data4'],
        label: {
          display: 'outside',
          field: ['data1', 'data2', 'data3', 'data4'],
          'text-anchor': 'middle'
        },
        gutter: 30,
        groupGutter: 10,
        xPadding: 5,
        yPadding: 0
    }]
});

Possible fix:

• The incorrect values seem to be caused by incorrect computing of the index (when some series are hidden - as indicated by the __excludes array, I suppose) in the function renderLabels (which in turn calls onPlaceLabels, which calls the default or custom renderer for series labels).
• In my opinion, instead of just fixing this issue, the most useful approach would be to modify the API for the series labels renderer, such that it would receive (consistent with the renderer for series tips), not the field value, but the item and storeItem.

Operating System:

• Windows 7 64 bit

[mitchellsimoens]

Thanks for the report.