javascript - 图表js如何在不点击的情况下切换线条

Question

我深入研究了一个 Chart.js 项目，为了简单起见，我们假设我在普通折线图中有 A、B 和 C 行。有没有办法创建一个包含所有 3 条线的图表，仅显示 A 和 B，并且 C 在图例中被划掉，而不显示在图表本身上？ (就像被点击一样切换。)

我想要的确切功能是
1.生成线 A、B 和 C
2.模拟 onClick() 到 C 行

我认为我忽略了一些非常简单的事情，并且想在重写 Chart.js 源代码之前确定一下。我搜索了文档但没有成功。

提前致谢!

Answer 1

好的，所以这真的很简单。

未隐藏的行的数据。 (与点击相同)

  {
        label: Object.keys(data)[i],
        fill: false,
        lineTension: 0.1,
        backgroundColor: color,
        borderColor: color,
        borderCapStyle: 'butt',
        borderDash: [],
        borderDashOffset: 0.0,
        borderJoinStyle: 'miter',
        pointBorderColor: color,
        pointBackgroundColor: "#fff",
        pointBorderWidth: 1,
        pointHoverRadius: 5,
        pointHoverBackgroundColor: color,
        pointHoverBorderColor: color,
        pointHoverBorderWidth: 2,
        pointRadius: 1,
        pointHitRadius: 10,
        data: data[Object.keys(data)[i]]
      }

以及隐藏(单击)的行的数据

  {
        hidden: true,
        label: Object.keys(data)[i],
        fill: false,
        lineTension: 0.1,
        backgroundColor: color,
        borderColor: color,
        borderCapStyle: 'butt',
        borderDash: [],
        borderDashOffset: 0.0,
        borderJoinStyle: 'miter',
        pointBorderColor: color,
        pointBackgroundColor: "#fff",
        pointBorderWidth: 1,
        pointHoverRadius: 5,
        pointHoverBackgroundColor: color,
        pointHoverBorderColor: color,
        pointHoverBorderWidth: 2,
        pointRadius: 1,
        pointHitRadius: 10,
        data: data[Object.keys(data)[i]]
      }

唯一的区别是

hidden: true

简单的修复。