alvarezguille
commented
7 years ago This seems to be related to the issue highcharts/highcharts#5688 of the underlying charting library. It should be fixed once we update to next version. Thanks for sharing the workaround!
Steps to reproduce the issue: 1) Starting from the Column with Multi Label Drilldown demo example, modify the source code as in the attachment. ColumnWithMultiLevelDrilldown.java.txt This change simply sets Costa Rica categories to the dummy 'blablabla' and to 'Life Expectancy' . Note that the last category is shared with the other country categories and the kind of such overlapping is: last category of Costa Rica = first category of the other countries. This type of overlapping actually produces the issue. 2) Run the Vaadin Chart application and do the following navigation 3) Click on 'Latin America and Carribean' 4) Click on 'Colombia' 5) Click on 'Back to Countries' 6) Click on 'Costa Rica'. At this point, you will see that, instead of only having the categories 'blablabla' and 'Life Expectancy', you will also have the other Colombia categories, that are 'Well-being (0-10)' and 'Footprint (gha/capita)'
It seems that when you navigate on two data series which have different overlapping category sets (as explained in item 1) the x axis labels get messed up.
WORKAROUND: 1) switch to AxisType.LINEAR x axis type 2) provide following JavaScript formatter function: function() {return this.axis.names[this.value];} This is the whole snippet: XAxis x = new XAxis(); x.setType(AxisType.LINEAR); x.getLabels().setFormatter("function() {return this.axis.names[this.value];}");