Nivo: Wrong values displayed on y-axis (line chart)

Created on 20 May 2019  ยท  6Comments  ยท  Source: plouc/nivo

Dear nivo team,

first thanks for the nice chart-library. Im currently trying to implement a line-chart in React JS in my frontend. I want to display some data (CAN messages).
The problem now is that the values get displayed completely wrong. Some of them are missing completely, some are displayed (e.g. 8. Hex-Byte) with values much too high (should be between 38 and 8, but get displayed with values over 400). I want to have a value range on the y-axis of the chart ranging from 0 to 256.
Values for the 8. Hex-Byte:

data: (13) [โ€ฆ]\
โ€‹โ€‹โ€‹0: Object { x: "Message 1", y: 23 }\
โ€‹โ€‹โ€‹1: Object { x: "Message 2", y: 38 }\
โ€‹โ€‹โ€‹2: Object { x: "Message 3", y: 34 }\
โ€‹โ€‹โ€‹3: Object { x: "Message 4", y: 4 }\
โ€‹โ€‹โ€‹4: Object { x: "Message 5", y: 4 }\
โ€‹โ€‹โ€‹5: Object { x: "Message 6", y: 8 }\
โ€‹โ€‹โ€‹6. Object { x: "Message 7", y: 38 }\
โ€‹โ€‹โ€‹7: Object { x: "Message 8", y: 8 }\
โ€‹โ€‹โ€‹8: Object { x: "Message 9", y: 23 }โ€‹\
9: Object { x: "Message 10", y: 8 }\
โ€‹โ€‹โ€‹10: Object { x: "Message 11", y: 8 }\
โ€‹โ€‹โ€‹11: Object { x: "Message 12", y: 8 }\
โ€‹12: Object { x: "Message 13", y: 8 }\

For clarification the data array for the line-chart looks like this:
2019-05-20 08_45_51-Window
--> as you can see there are 13 values for every line in the chart (should be 13 lines)

I used the code from the docs for the line-chart (https://nivo.rocks/line/).

The displayed line-chart looks like this:
2019-05-20 08_53_24-Window

Maybe you could give me a hint what I am doing wrong and how I can fix the chart :) would be really great. Thank you very much in advance.

awaiting feedback invalid

Most helpful comment

stacked: false

All 6 comments

stacked: false

Hi @psycr0w13, please provide a running example on codesandbox as asked in the issue template. Thank you

@rrdlpl Thank you so much :) thats it!!!
@plouc Thanks also to you, next time Ill provide a running example!

@psycr0w13 was there any other solution to this? Stacked false doesn't work for me. I have the same issue but am having trouble getting a code sandbox.

@rrdlpl thanks! Worked for me too. Do you know why this solves the issue?

@rrdlpl thanks! Worked for me too. Do you know why this solves the issue?

I don't use this library anymore. I guess the default behaviour is to stack the values. ๐Ÿคทโ€โ™‚๏ธ

Was this page helpful?
0 / 5 - 0 ratings

Related issues

stahlmanDesign picture stahlmanDesign  ยท  3Comments

Buvaneshkumar7 picture Buvaneshkumar7  ยท  3Comments

gcloeval picture gcloeval  ยท  3Comments

vagnervst picture vagnervst  ยท  4Comments

dubzzz picture dubzzz  ยท  3Comments