ChartsCSS / charts.css

Open source CSS framework for data visualization.
https://ChartsCSS.org
MIT License
6.17k stars 175 forks source link

Line gets clipped in line chart when value is 100% #73

Open russelporosky opened 1 year ago

russelporosky commented 1 year ago

I noticed this in the Chart Builder - if you select Line Chart, the peak is cut off for the "100" value.

image

Likewise, if two side-by-side bars are both at 100, the line disappears completely.

image

ramiy commented 1 year ago

Hi @metaloha, Can you share your code?

I think the docs should be updated to explain what happens in those cases (above 100% and below 0%).

russelporosky commented 1 year ago

I don't have any of my own code, this is the example code in your Chart Builder. Just select Line Chart and see the problem.

Whether a value can be outside the bounds isn't related to this bug (unless the 100 value is just hidden by a clipping rectangle or overflow rule).

To expand, this doesn't happen at the 0 value, only the 100.

image

lachlanjc commented 1 year ago

I ran into this issue yesterday. I added some custom CSS to solve but uncheck it in devtools & you'll see clipping: https://lil-dashboard.vercel.app/weather

Source code: https://github.com/lachlanjc/lil-dashboard/blob/main/app/weather/page.js

Kedarnath-Rothe commented 9 months ago

Please assign this issue to me