如何使用 ChartJS 一次只显示一个标签/行

Question

我在一个项目上使用 ChartJS 来绘制一个折线图，它有 5 个不同的线/标签。

默认情况下，ChartJS 会一次性绘制所有线条，您可以单击它们的每个标签以停用它们。我想要相反的，但我还没有找到办法做到这一点。

  canvas = document.getElementById("graph_currency")
  ctx = canvas.getContext("2d")

  graph_currency = {
    labels: ["Pon", "Wt", "Sro", "Czw", "Pt", "Sb", "Nd"],
    datasets: [
      {
        label: "Placeholder label, will remove",
        backgroundColor: "rgba(88, 234, 245, 0.4)",
        strokeColor: "#76e5f2",
        pointColor: "#103e58",
        borderColor: "rgba(75,192,192,1)",
        pointBorderColor: "#103e58",
        pointBackgroundColor: "#103e58",
        pointRadius: 10,
        pointHoverRadius: 8,
        pointHoverBorderWidth: 2,
        pointHoverBackgroundColor: "rgba(220,220,220,1)",
        pointHoverBorderColor: "#103e58",
        data: [4.7000, 4.5600, 4.8110, 4.9000, 4.9890, 4.8292, 4.68690]
      },
        {
          label: 'GBP',
          backgroundColor: "rgba(88, 234, 245, 0.4)",
          strokeColor: "#76e5f2",
          borderColor: "rgba(75,192,192,1)",
          pointBorderColor: "#103e58",
          pointBackgroundColor: "#103e58",
          pointRadius: 10,
          pointHitRadius: 10,
          pointHoverRadius: 8,
          pointHoverBorderWidth: 2,
          pointHoverBackgroundColor: "rgba(220,220,220,1)",
          pointHoverBorderColor: "#103e58",
          data: [4.5600, 4.5600, 4.8110, 4.9000, 4.7000, 4.68920, 4.68690] 
        },
         {
          label: 'CHF',
          backgroundColor: "rgba(88, 234, 245, 0.4)",
          strokeColor: "#76e5f2",
          borderColor: "rgba(75,192,192,1)",
          pointBorderColor: "#103e58",
          pointBackgroundColor: "#103e58",
          pointRadius: 10,
          pointHitRadius: 10,
          pointHoverRadius: 8,
          pointHoverBorderWidth: 2,
          pointHoverBackgroundColor: "rgba(220,220,220,1)",
          pointHoverBorderColor: "#103e58",
          data: [4.9000, 4.5600, 4.81100, 4.80000, 4.70000, 4.68920, 4.68690] 
        }
    ]
  }
  myNewChart = new Chart(ctx, {type: "line", data: graph_currency,})

这是我当前图表的代码。http://jsfiddle.net/9aqjq4zL/ - 这是一个有效的 JSfiddle 和我正在谈论的例子。图表绘制完毕，所有线条同时出现，如果单击顶部标签，相应线条将消失。

我的问题是：是否可以一次只显示一行，然后单击标签的操作只选择要显示的那一行？

先感谢您。

（这似乎可能有答案，但它是针对 angular ChartJS，所以我还没有能够应用它 。https://github.com/jtblin/angular-chart.js/issues/70）