Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Stacked stepped time lines does not rendering correctly #8596

Closed
davideferre opened this issue Mar 9, 2021 · 5 comments · Fixed by #8781
Closed

Stacked stepped time lines does not rendering correctly #8596

davideferre opened this issue Mar 9, 2021 · 5 comments · Fixed by #8781

Comments

@davideferre
Copy link

I've a stacked stepped time lines chart that seems to render uncorrect values randomly.
This is the screenshot of the problem:
stacked_line_bug_1
stacked_line_bug_0

This is the codpen link to the bug reproduction: https://codepen.io/davideferre/pen/XWNxLKp

I'm using 2.9.4 chart.js version.

As you can see in the screenshot or in codepen the first two point of the violet COMP12 line are 1 and 0 but they are at the same height on the Y axis.
Sometimes the line render correctly but when I try to disable a dataset the other datasets fall on the same behavior.
Am I doing something wrong or this is a bug?

@kurkle
Copy link
Member

kurkle commented Mar 9, 2021

In 2.9 the stacking is based on the array index of the values. So you'd need to make sure each data array contains value (or undefined/NaN) for each point. Or you could upgrade to v3 beta.

@davideferre
Copy link
Author

In 2.9 the stacking is based on the array index of the values. So you'd need to make sure each data array contains value (or undefined/NaN) for each point. Or you could upgrade to v3 beta.

I've created another codepen trying your suggestions but it doesn't working anymore with 2.9v:

https://codepen.io/davideferre/pen/yLVQNGB

The purple line takes 3 values ​​0,1 and 2 while I would have expected it to take only 2

@etimberg
Copy link
Member

etimberg commented Mar 9, 2021

It appears better when the data goes in as just an array of values. https://codepen.io/etimberg/pen/oNYQjQa

@davideferre
Copy link
Author

davideferre commented Mar 17, 2021

It appears better when the data goes in as just an array of values. https://codepen.io/etimberg/pen/oNYQjQa

I can't draw chart as you suggest because the lines appear overlapping.
I've created another codepen with the null values where they don't have a specific value, but as you can see on the purple line (COMP12) the second point is 1 and the third is 0 but they are at the same level.
Moreover in the point where there is the peak of the purple line the previous point is already 1 but it is at the same level as the zero points.
https://codepen.io/davideferre/pen/gOLJwao

@kurkle
Copy link
Member

kurkle commented Mar 17, 2021

Are you trying to have "comp22" in range 0..1 , "comp12" in range 1..2 etc. independent on the other values?

"stacked" means the values are added. at index 0 you have 0 and 1 = 1, index 1 you have 1 and 0 = 1

You should set the hover and tooltip modes to index to highlight and see the values that are stacked together.

image

https://codepen.io/kurkle/pen/MWbdbVo

# for free to join this conversation on GitHub. Already have an account? # to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants