'All labels are not being shown in the x axis in Vue Apex Charts

xaxis: {
          type: this.domain_type,
          categories: this.domain,
          labels: {
            show: !this.isMobileOnly,
            style: {
              colors: this.range_color,
            },
            formatter: (val) =>{
                if(new Date(val).getMonth() === new Date().getMonth()) {
                  // only those dates that includes May in their name
                  // every label that I want is being shown except the May 2022 Label
                  // May 2022 does get returned here but doesn't get shown as a label on x-axis
                  return moment(val).format("MMM, YYYY");
                }
          },
          tickPlacement: 'on',
          axisBorder: {
            show: false,
          },
          axisTicks: {
            show: this.range_ticks,
          },
          tooltip: {
            enabled: this.range_tooltip,
          },
          tickAmount: undefined,
          offsetX: 28,
          },

I want to show all the labels in the x-axis in my apex chart component. In my formatter method, I check if the data (which is in the form of dates) includes the current month name irrespective to the year and if it does then, it should be rendered as a label in x-axis. All labels are being show in the x-axis except the last one that is May 2022. Why is the last label not being shown on the chart ?

X-axis Labels



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source