Skip to content

Data Labels are missaligned and the last x grid line is not wisible #4206

@clarisandev

Description

@clarisandev

Description

  • Data labels are missaligned
  • Although the last x label and tick are visible, the last x grid line is not

Steps to Reproduce

  1. Create a Multiple series – Group rows Timeline chart => https://apexcharts.com/javascript-chart-demos/timeline-charts/multiple-series-group-rows/
  2. Add to options:
grid: {
   xaxis: {
     lines: {
       show: true
     }
   },
   yaxis: {
     lines: {
       show: false
     }
   },
},
dataLabels: {
   enabled: "true"
}

Expected Behavior

  • DataLabels should to be displayed inside the bars that they relate to.
  • All x axis ticks should have a grid line

Actual Behavior

  • DataLabels are missaligned
  • Last X-axis grid line is not shown

Screenshots

  • Missing last x grid line
    Screenshot from 2024-01-30 09-21-10

  • Missaligned data labels
    Screenshot from 2024-01-30 09-20-54

Reproduction Link

CODEPEN => using the same example as the one provided in the docs: https://apexcharts.com/javascript-chart-demos/timeline-charts/multiple-series-group-rows/

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't workingverified

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions