leeoniya / leeoniya/uPlot

missing points in plot when surrounded by null values

Open
#1,042 1 comment 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

demos enhancement question
Dominant language
JavaScript
Stars
10.5k
Forks
463
PR merge metrics
No merged PRs in 30d

Description

Hi,

I wanted to share an edge case that we've encountered when dealing with null data points. If a non-null data point is surrounded by null values, and if we haven't overriden the default options, then we risk encountering a situation where a point does not show up in the plot unless hovered. I've attached screenshots and a demo for your reference:

Image
Image

Demo: https://codepen.io/tempac0345/pen/wvVOEPq

As you can see, the data does have a point in index 2 but it does not show up in the first image. We've managed to fix this on our side with the following series point options:

const seriesPointsFilter = (
  u,
  sIdx,
  show,
)=> {
  const vals = u.data[sIdx];

  // respect when default uplot behaviour sets show to true
  if (seriesPointsShow(u, sIdx)) {
    return Array.from(vals.keys());
  }

  const indices: number[] = [];

  for (let i = 0; i < vals.length; i++) {
    if (vals[i] === null) {
      continue;
    }

    const prevNull =
      i === 0 || vals[i - 1] === null
    const nextNull =
      i === vals.length - 1 ||
      vals[i + 1] === null

    if (prevNull && nextNull) indices.push(i);
  }

  return indices;
};

 points: {
            show: true,
            filter: seriesPointsFilter,
          },

As you can see, we use the series point filter option to maintain the default "show" behaviour where relevant whilst also forcing the non-null points surrounded by null values to show up in the chart. It's not ideal for every use case but it works well for us.

My opinion is that hiding those points feels like unexpected behavior. We use uplot for dynamic data and so this issue went unnoticed for a few days. In our case, those data points are of equal importance to the rest of the data. It feels to me like it should be part of the default behaviour so I thought it best to share this with you just in case you agreed. If you disagree, feel free to close the issue.

Thanks as always!

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the default point options linked in src/opts.js and reproduce the missing point using the provided CodePen demo. Compare the default filtering behavior with the reported custom series point filter. Done means a non-null point surrounded by null values is visible without requiring a custom filter, while preserving the existing default show behavior.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
data-visualization
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.