score:0

Accepted answer

you don't have to categorize yaxis - you can display proper yaxis labels using yaxis.labels.formatter function:

var yaxiscategories = ['first', 'second', 'third', 'fourth', 'fifth', 'sixth', 'seventh', 'eighth', 'ninth']
yaxis: {
 labels: {
   formatter() {
     return yaxiscategories[this.pos]
   }
 }
},

jsfiddle with formatter

if you'd like to stick with categorized yaxis, you can manually move xaxis closer to they yaxis 0 value using xaxis.offset property together with yaxis.tickmarkplacement 'on' property. in this example, i have put -34px rigidly, but you can calculate the proper value in chart.load event and then update calculated offset.

xaxis: {
  type: 'category',
  offset: -34
},

yaxis: {
  type: 'category',
  categories: ["first", "second", "third", "fourth", "fifth"],
  tickmarkplacement: 'on'
},

jsfiddle with offset

if you want to try a different approach, let me know - i will edit my answer.

api references:

 https://api.highcharts.com/highcharts/yaxis.labels.formatter
 https://api.highcharts.com/highcharts/yaxis.tickmarkplacement
 https://api.highcharts.com/highcharts/xaxis.offset

Related Query

More Query from same tag