[Solved]-Show custom xaxis in highchart with angular-Highcharts

You need to import and initialize the highcharts-grouped-categories module: https://www.npmjs.com/package/highcharts-grouped-categories

import * as Highcharts from 'highcharts';
import HighchartsGroupedCategories from 'highcharts-grouped-categories';
import { Injectable } from '@angular/core';

HighchartsGroupedCategories(Highcharts);

Live demo: https://stackblitz.com/edit/highcharts-angular-demo-4y3css?file=src%2Fapp%2Fhighcharts.service.ts

Docs: https://github.com/highcharts/highcharts-angular#to-load-a-module