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.

null values in the data object

See original GitHub issue

Hey,

First of all I want to thank you all for this amazing library!

Currently I’m trying to visualise data with null values. The data is extracted from diesel generators, and null values means the generator is either turned off at that moment, or there is no connection. I understand from this comment https://github.com/uber/react-vis/issues/109#issuecomment-248211411 that null values will be automatically converted to zeros, however in this use case that would mean the generator is turned on, but not outputting any power. Zeros are different than null’s.

An example dataset could be: const data = [{x: 0, y: 10}, {x: 1, y: 11}, {x: 2, y: null}, {x: 3, y: 13}, {x: 4, y: 14}];

Which looks like this (null is changed to 0, y-axis doesn’t scale well?): image

What I’m trying to achieve is the following: image

The only way I managed to accomplish this, is by changing the _renderLine function in the source code of line-series (and some other series for it to work as well, like line-mark-series) from this: line = line.x(x).y(y);

to this: line = line.x(x).y(y).defined((d) => d.y !== null);

However I’m quoting from the comment I just mentioned

We want the user to provide well structured data and deal with such corner cases as null or undefined values of objects (currently they will be treated as zeros).

What would be the best way to deal with this without changing the source code. Or is there currently no way (and would you accept such a pull request?)

Thank you very much!

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Reactions:3
  • Comments:9 (5 by maintainers)

github_iconTop GitHub Comments

1reaction
jckrcommented, Aug 30, 2017

I think the larger issue is that the lineSeries treats a series of datapoint the same way that other …Series treat a single datapoint - as the smallest atomic object. We can’t pass data per datapoint (ie stroke-dasharray, thickness, color…) and have to do this at the level of the line. What we could do is create a segmentSeries that, instead of generating a <path />, would generate a number of <line /> elements which could all be accessed and manipulated. such a series could deal with missing values.

1reaction
mcnuttandrewcommented, Jun 19, 2017

Hey @tijp

The quickest/dirtiest workaround will be for you to split your data at every null and introduce a new line series for each continuous section of data, which would be the spirit of the comment that you are highlighting. However, this is clearly not an ideal solution! We would gladly accept PR adding defined to renderLine. I’d suggest a prop on LineSeries called defined that accepts a function or a string (same pattern as curve).

(also @ericsoco there’s an open issue for accessors here at #360)

Read more comments on GitHub >

github_iconTop Results From Across the Web

Specifying Null Values for Objects - Oracle Help Center
Specifying null values for nonscalar data types is somewhat more complex than for scalar data types. An object can have a subset of...
Read more >
null - JavaScript - MDN Web Docs - Mozilla
The null value represents the intentional absence of any object value. It is one of JavaScript's primitive values and is treated as falsy...
Read more >
Working with SQL NULL values - SQLShack
In terms of the relational database model, a NULL value indicates an unknown value. If we widen this theoretical explanation, the NULL value...
Read more >
Handling JSON null and empty arrays and objects - IBM
Null values. JSON has a special value called null which can be set on any type of data including arrays, objects, number and...
Read more >
Data Types and Missing Values | Kaggle
Entries missing values are given the value NaN , short for "Not a Number". For technical reasons these NaN values are always of...
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