'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 ?
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|

