question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Bars Overlap axis When minValue is greater than 0.

See original GitHub issue

Describe/explain the bug If bar axis minimum is set much above 0, the bars extend off the edge of the chart and obscure the axis & its labels

To Reproduce https://codesandbox.io/s/nivobar-chart-overlapping-axis-mod21?file=/src/index.js

Steps to reproduce the behavior:

  1. Create a bar chart with either orientation.
  2. Set minValue to be > 0. 20% or so of smallest entry works best to reproduce.

Expected behavior A clear and concise description of what you expected to happen.

Screenshots image

Desktop (please complete the following information):

  • OS: Windows
  • Browser Chrome
  • Version 86

Additional context I might be able to work around this in my app by adjusting the stack order…

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:8 (5 by maintainers)

github_iconTop GitHub Comments

1reaction
ollwenjonescommented, Nov 10, 2020

would love to. just racing towards a deadline at present. This is linked in our backlog, so it’s not unlikely someone will circle back and contribute 😄

1reaction
wyzecommented, Nov 10, 2020

Just a couple changes to scales package. Here https://github.com/plouc/nivo/blob/8451c279099d3931afc35950ae52aa22b84ee7f6/packages/scales/src/linearScale.js#L13 add something like , clamp = false to the first parameter.

Then somewhere down here https://github.com/plouc/nivo/blob/8451c279099d3931afc35950ae52aa22b84ee7f6/packages/scales/src/linearScale.js#L34 add if (clamp) { scale.clamp(true) }.

Update PropTypes in that linearScales file.

Update typings for scales package here https://github.com/plouc/nivo/blob/8451c279099d3931afc35950ae52aa22b84ee7f6/packages/scales/index.d.ts#L16 with clamp?: boolean.

That should do it.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to set max and min value for Y axis - chart.js
As you can see max value (130) and min value (60) for Y axis are chosen automatically , I want max value =...
Read more >
What you can conclude when two error bars overlap (or don't)?
If two SEM error bars do overlap, and the sample sizes are equal or nearly equal, then you know that the P value...
Read more >
How to Check for Significance by Adding Error Bars
Under the. Vertical Axis menu, make sure the Min value is set to zero (0). Next, click on. Vertical Axis. Click on the...
Read more >
Unpin Axis from zero - but setting a minimum value that is a ...
Hello, I have a question about the Unpin from zero. I want to set a minimum value so the lowest value will at...
Read more >
Excel Data Bars Conditional Formatting with examples - Ablebits
How to add data bars in cells; Gradient Fill vs. ... For example, you can set data bar percentage, with the minimum value...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found