Annotations dont align with labels on bar charts with option grid false - Githubissues

apexcharts / apexcharts.js

📊 Interactive JavaScript Charts built on SVG

https://apexcharts.com

MIT License

14.2k stars 1.29k forks source link

Annotations dont align with labels on bar charts with option grid false #3392

Open joel-wenzel opened 1 year ago

joel-wenzel commented 1 year ago

Description

When setting grid: {show: false} and chart type: 'bar', any annotation label backgrounds do not align with the label text.

Steps to Reproduce

Set chart type to bar
Set grid show to false
Add x or y annotations.

See repro link below (no changes needed as problem is immediately visible)

Expected Behavior

Annotation label text should align with the label background

Actual Behavior

They are offset by a few pixels. (maybe the width of the bar columns)

Screenshots

Reproduction Link

https://codepen.io/joel-wenzel/pen/QWrQqeZ?editors=0010

joel-wenzel commented 1 year ago

Just in case for others: the following grid settings work around it

grid: {
      show: true,
      borderColor: '#00000000'
},