胜利图表——突破线

Question

是否可以打破胜利图表中的情节线？我可以通过制作两条相同颜色的不同绘图线来做到这一点，但我正在寻找一种自动方式。我有很多零的数据，我只想要曲线。如果我删除零值，线条会连接起来。

我有这个。这些线在轴原点下方的零处连接：

我想要这个：

Answer 1

我使用这个函数从一个带零的数组创建了多个数据行：

export function breakLine(buffer: any[], startTime: any) {
  let zeroCounter = 0;
  let signalCounter = 0;
  let curr: any[] = [];
  let result: any[] = [];
  buffer.forEach((value: any) => {
    // any value less than 20 will be considered a zero
    if (value.result[0] < 20) {
      zeroCounter++;
    } else {
      curr = [
        ...curr,
        {
          x: value.time - startTime,
          y: value.result[0],
        },
      ];
      signalCounter++;
      zeroCounter = 0;
    }

    // break line on 3 or more consecutive zeroes
    if (zeroCounter >= 3 && signalCounter > 0) {
      result = add(curr, result);
      zeroCounter = 0;
      signalCounter = 0;
      curr = [];
    }
  });
  // remaining in current after loop
  result = add(curr, result);
  return result.filter((plot: any) => plot.length > 0);
}

我为每个嵌套数组映射一行：

line1.map((data) =>
        <VictoryLine
        style={{
            data: { stroke: '#0000FF' },
            parent: { border: '1px solid #ccc' },
        }}
        data={data}
    />)

胜利图表——突破线

Victory Charts -- Break Line

javascript

victory-charts