How to show x-axis dotted labels on y-axis for multiple column chart in hightchart js

Can we show x-axis label names year to date sales and OKR for sales on y-axis for multiple column chart using highchart.
I am using this script

chart = Highcharts.chart('chart-container_'+nextChartId, {
			chart: {
				spacingTop: 3,
				spacingRight: 0,
				spacingBottom: 3,
				spacingLeft: 0,
				type: chartType, 
				inverted: hasSwitchChart
			},
			title: {
				text: resData.name, 
			},
			 
			yAxis: {
				title: {
					text: yAxisName
				},
				
			}, 
			xAxis: {
				categories: chartData,
				type: 'datetime',
				//reversed: true 
				title: {
					text: xAxisName
				},
				   
			},
			plotOptions: {
				series: {
							borderWidth: 0,
							dataLabels: {
								enabled: hasShowDataValue,
								format: '{point.y}'
						}
				}
			},
			series: chartSeriesData 
		});

Please see attachment!

Example: https://jsfiddle.net/js2t3hn9/3/

Please guide me.
Thanks

I see that you want to place legend items in place of the y-axis title. To do that, you can rotate and dynamically position the legend, for example in render event.

Highcharts.chart('container', {
  chart: {
    ...,
    events: {
      render: function() {
        const chart = this;
        chart.legend.group.attr({
          rotation: -90,
          translateX: 0,
          translateY: chart.yAxis[0].height / 2 + chart.legend.legendWidth / 2 + chart.plotTop
        });
      }
    }
  },
  legend: {
    enabled: true,
    align: 'left',
    verticalAlign: 'middle',
    floating: true
  },
  ...
});

Live demo: http://jsfiddle.net/BlackLabel/fwmoyjxs/

API Reference: https://api.highcharts.com/class-reference/Highcharts.SVGElement#attr