ngx-charts
ngx-charts copied to clipboard
Show gap in Charts when value is missing
What kind of change does this PR introduce? (check one with "x")
- [ ] Bugfix
- [x] Feature
- [ ] Code style update (formatting, local variables)
- [ ] Refactoring (no functional changes, no api changes)
- [ ] Build related changes
- [ ] CI related changes
- [ ] Other... Please describe:
What is the current behavior? (You can also link to an open issue here) https://github.com/swimlane/ngx-charts/issues/799 If there are gaps in the data, like a null value of a point in a series, then it will be displayed as an empty value (0) rather than drawing nothing.
What is the new behavior? There is a gap in the Chart.
Does this PR introduce a breaking change? (check one with "x")
- [ ] Yes
- [X] No
If this PR contains a breaking change, please describe the impact and migration path for existing applications: ...
Other information:
Hey,
I am no contributor, but I like your feature request.
But to stay consistent with ES standards you should reduce it only to 'non existing values' like undefined
.
So you provide both possibilities. Because some maybe wants the zero line and since ES2015 you have two values undefined
for "not exists" and null
for "empty".
This short example will show you why a difference makes sense
// {emptyValue: null}
console.log(JSON.parse(JSON.stringify({emptyValue: null})));
// {}
console.log(JSON.parse(JSON.stringify({notExists: undefined})));
Hi @Apke,
Thanks for your suggestion.
I think null is the correct type to display "nothing" in the sense of the absence of any value. But you're right, there are probably people that want the current behavior. Maybe an option to toggle this behavior would be the best solution.
Links:
Hi @bweben,
You are right by definition the null value sounds like the best one, because it is like empty. Sry that it is not the same wording, but it is easier to understand than "not assigned" and "absence" ;)
undefined value primitive value used when a variable has not been assigned a value
I believe we can discuss for years which of both types is the best, because it also makes sense that "a value is not assigned" it is also not rendered.
In both cases it is NaN
, so you are completely right with your solution and I don't wanted to talk it down.
I only wanted to share a possibility to have both features without creating an option which needs to be checked and increase the "complexity" a bit. The good point with "undefined" is that you would act like JavaScript core functions.
But I confirm with you, that the bad thing on my proposal is, that it needs to be documented and explained for these who don't know the difference. So a option/configuration could be explained by a comment.
So your decision ;) and thank you for your response.
Hi @Apke,
I'm sorry for the late response. In my opinion it's best to have an opinion from a contributor, whether it should be an option or otherwise implemented. Regardless of their opinion about that, I would like to thank you for your suggestion 👍.
Would be nice to have this feature. Is there any progress on this issue?
This is awesome work. I would also stay with null. Can you merge it please?
I resolved the conflicts, now we just have to wait for feedback from maintainers 😃.
Great work! looking forward to using this once it's merged! 😃
Any update on this? This would be a very useful feature.
Sadly nothing heard yet from any contributors. I would resolve the conflicts as soon as I hear that the changes are somewhat ok.
Any update on this? This would be a very useful feature.
Depending on your use case, here's a potential work around till this gets merged https://github.com/swimlane/ngx-charts/issues/799#issuecomment-505060129
I'd also find this feature to be very useful, it would be great if a contributor would chime in.
I'm looking forward to have this supported. Currently it can be achieved by workaround (create multiple series with the same name, each time there is a gap in data). But having it able to split the line just by inputting null or undefined, that would be helpful.