如何把功能在ChartJS数据结构?

Question

我正在制作一个使用ChartJS库的图形网站。此图表在网站上显示所有可用的默认数据。

我的目标是让访问者选择不同数量的图表数据。所以，我在图表的顶部做了一个按钮，当访问者点击它时，必须改变显示的数据数量。

问题是ChartJS使用JSON对象，我没有成功配置不同的行为。

...
datasets: [
{
label: "Exemple",
data: [
{ x: "Day1", y: 0 },
{ x: "Day2", y: 1 },
{ x: "Day3", y: 2 },
{ x: "Day4", y: 3 },
{ x: "Day5", y: 4 },
....
],
...

我试着在上面放一个事件，比如:

data: mybutton.addEventListener("click", () => {
[{x: "Day1", y: 0}]
},

函数，如:

data: myFunction(),

即使是带有function into的变量，比如:

const myData = () => {
// function
}
data: myData,

或If else

毫无效果……你知道吗?

Answer 1

我自己找到了解决办法。

我把JSON对象放在一个函数中，放一个AddEventListener("click"， function())，针对JSON的部分进行修改，并在末尾添加一个update()。

function chartFunction() {
....
// data before
datasets: [
{
label: "Exemple",
data: [
{ x: "Day1", y: 0 },
.....

button.addEventListener("click", () => {
(myChart.data.datasets[0].data = [...]).myChart.update();
});
};
chartFunction();