The Goal
I am working with a Highcharts Heatmap to present data which must have two YAxis displays (on on the left and one on the right). Both are to be of the "categories" type (which is to say driven by strings, not numerical values).
The Problem
When multiple Y axes are defined, only the labels for the first are shown.
The Code
Here is a fiddle with my code. I would specifically draw your attention to these lines:
yAxis: [{
categories: ["For instance, on the planet Earth, man had always assumed that he was more intelligent than dolphins because he had achieved so much—the wheel, New York, wars and so on—whilst all the dolphins had ever done was muck about in the water having a good time. But conversely, the dolphins had always believed that they were far more intelligent than man—for precisely the same reasons",
'The man who invented the Total Perspective Vortex did so basically in order to annoy his wife.',
'The major problem - one of the major problems, for there are several - one of the many major problems with governing people is that of whom you get to do it; or rather of who manages to get people to let them do it to them.',
'My doctor says that I have a malformed public-duty gland and a natural deficiency in moral fibre',
'He felt uncertain as to whether the fourth drink had understood all that, so he sent down a fifth to explain the plan more fully and a sixth for moral support.'],
title: null,
gridLineWidth: 0,
labels: {
style: {
whiteSpace: 'nowrap',
textOverflow: 'ellipsis',
float: 'left'
}
}
},{
categories: ["1/7", "2/7", "3/7", "4/7", "5/7"],
title: null,
opposite: true,
// Note: The following two lines appear to be unnecessary
type: 'category',
visible: true
}],
Observe that the first yAxis column appears properly along the left side of the chart. Observe also that there is no visual representation of the second yAxis (which is set to appear on the right side of the graphic, between the plot and the legend).
What is interesting is if I reorder the two Y axes, the categories on the right now appear, and the ones on the left disappear. Additionally interesting; if the axes are given titles (title: null is removed or changed), the titles appear in the correct place.
The Documentation
The code seems to be perfectly in line with the official examples for dual Y axes. Even copying that sample code exactly causes the same failure. I know that the HeatMap chart type is not necessarily part of the core library, but I have found no indication that this shouldn't work with a Heatmap.
Conclusion
Any help that could be given to getting Y axis labels to display on both sides of the plot would be greatly appreciated. Thank you in advance.
You can use the linkedTo parameter.
yAxis: [{
type: 'category',
categories: ["For instance, on the planet Earth, man had always assumed that he was more intelligent than dolphins because he had achieved so much—the wheel, New York, wars and so on—whilst all the dolphins had ever done was muck about in the water having a good time. But conversely, the dolphins had always believed that they were far more intelligent than man—for precisely the same reasons", 'The man who invented the Total Perspective Vortex did so basically in order to annoy his wife.', 'The major problem - one of the major problems, for there are several - one of the many major problems with governing people is that of whom you get to do it; or rather of who manages to get people to let them do it to them.', 'My doctor says that I have a malformed public-duty gland and a natural deficiency in moral fibre', 'He felt uncertain as to whether the fourth drink had understood all that, so he sent down a fifth to explain the plan more fully and a sixth for moral support.'],
title: null,
gridLineWidth: 0,
labels: {
style: {
whiteSpace: 'nowrap',
textOverflow: 'ellipsis',
float: 'left'
}
}
},{
linkedTo: 0,
categories: ["1/7", "2/7", "3/7", "4/7", "5/7"],
title: null,
opposite: true,
// Note: The following two lines appear to be unnecessary
type: 'category',
visible: true
}],
Example: