Can't display x axis as category strings in bar chart

[ndrwkim]

Describe the bug
When trying to render a bar chart using a 2D data series with strings for the x axis, the chart won't render properly.

Expected behavior

>>> chart = Chart('container')
>>> chart.add_series(BarSeries(data=[['A', 1], ['B', 2], ['C', 3]]))
>>> chart.to_js_literal()
document.addEventListener('DOMContentLoaded', function() {
  Highcharts.chart('container', {
    xAxis: {type: 'category'},
    series: [{
      data: [
        ['A', 1],
        ['B', 2],
        ['C', 3],
      ],
      type: 'bar'
    }]
  });
});

https://jsfiddle.net/m6q7koLx/1/

Actual behavior

>>> chart = Chart('container')
>>> chart.add_series(BarSeries(data=[['A', 1], ['B', 2], ['C', 3]]))
>>> chart.to_js_literal()
document.addEventListener('DOMContentLoaded', function() {
  Highcharts.chart('container', {
    xAxis: {type: 'category'},
    series: [{
      data: [
        {x: 'A', y: 1},
        {x: 'B', y: 2},
        {x: 'C', y: 3},
      ],
      type: 'bar'
    }]
  });
});

https://jsfiddle.net/m6q7koLx/2/

[hcpchris]

Hmm - this seems a bit of an odd issue. Highcharts (JS) is not currently reading the x property in the data point as the category value, but is instead looking for that value to be present in the name property. I believe this may actually be a change in earlier Highcharts (JS) behavior and may be a bug in Highcharts (JS).

I'll check with the JS team to determine whether the x property should supply the x-axis value in a category-type x-axis (which would make logical sense, I think). If they come back that it should only be determined by the name property, then we'll fix it in the next version of Highcharts Core for Python.

[hcpchris]

A workaround in the meantime is to populate your data with setting the name property explicitly to the x property value. Something like:

>>> chart = Chart('container')
>>> chart.add_series(BarSeries(data=[['A', 1], ['B', 2], ['C', 3]]))
>>> for item in chart.series[0].data:
>>>    item.name = item.x
>>> chart.to_js_literal()

[hcpchris]

Confirmed with the JS team that this is the intended behavior on the JS side, so it looks like a bug in Highcharts Core for Python that will need to be patched. It should be patched / released later today.

[ndrwkim]

Thank you for looking into this. I'm just getting back to working with this library and it is still not working for me on v1.2.6. Your workaround also doesn't work. The JS output still does not display the BarSeries. https://jsfiddle.net/24a7yehj/

[ndrwkim]

What does work is https://jsfiddle.net/e8zpvhqt/ per the JS docs: https://api.highcharts.com/highcharts/series.bar.data
But Highcharts Core for Python converts the data arg into a JS obj rather than leaving it as an array of arrays when the x property value is a string.

[hcpchris]

Sorry you're still running into this issue! What's interesting is that several other cases do work which is what gave us the false-positive in our testing. Specifically, this works: https://jsfiddle.net/highchartspython/v2etpx08/3/ and so does this: https://jsfiddle.net/highchartspython/9w4oyx5c/1/

So I've re-opened this issue so that it can be addressed in our next release (v.1.3.0), which should happen over the weekend.

As for the scenario where the data arg is converted to a JS obj, yes: That was the original design approach adopted by Highcharts for Python to support more extensive object and state management. However, that forced conversion into a JS obj is something that we'll actually be refactoring in the next minor release (v.1.3.0 - see #77) to better improve performance in any case (basically when serializing a data points to JS literals, if they only have properties configured that can be serialized back to the JS array form, then rather than serializing them to a JS obj we'll serialize them back to a JS array).

[hcpchris]

Given the cases that do work, a more precise workaround that should work is:

chart = Chart(container = 'container')
chart.add_series(BarSeries(data=[['A', 1], ['B', 2], ['C', 3]]))
chart.options.x_axis = {'type': 'category'}
for item in chart.options.series[0].data:
    item.name = item.x
    item.x = None
chart.to_js_literal()

[hcpchris]

Hi @ndrwkim : Just confirming that this issue should have been addressed in v.1.3.0 which was released over the weekend (and so this issue got auto-closed). Please feel free to upgrade and check if the issue is still outstanding: hopefully it should be resolved, but if not we'd be grateful if you could re-open and let us know!

[ndrwkim]

@hcpchris This is now working as expected. Thank you for working on this!

[hcpchris]

Awesome - glad to hear it! If you run into any other issues, please let us know.