Javascript 使用ChartJS单击更改数据

Javascript 使用ChartJS单击更改数据,javascript,chart.js,Javascript,Chart.js,我有一张欧元价值的折线图。我希望能够更改$中的数据 欧元图表运行良好,但我无法更改数据 我的图表: <canvas id="myChart" width="820" height="650"></canvas> let ctx = document.getElementById("myChart"); Chart.defaults.global.defaultFontSize = 15; var dataEu = [{{{ cote_1989_e

我有一张欧元价值的折线图。我希望能够更改$中的数据

欧元图表运行良好,但我无法更改数据

我的图表:

   <canvas id="myChart" width="820" height="650"></canvas>
   let ctx = document.getElementById("myChart");
   Chart.defaults.global.defaultFontSize = 15;

   var dataEu = [{{{ cote_1989_eu_base_eu }}}, {{{ cote_2004_base_eu }}}, {{{ cote_2014_base_eu }}}, {{{ cote_2017_base_eu }}}, {{{ cote_actual_base_eu }}}];
   var dataUsd = [{{{ cote_1989_eu_base_usd }}}, {{{ cote_2004_base_eu }}}, {{{ cote_2014_base_usd }}}, {{{ cote_2017_base_usd }}}, {{{ cote_actual_base_usd }}}];
   var myChart = new Chart(ctx, {
      type: 'line',
      data: {
         labels: ["1989", "2004", "2014", "2017", "2019"],
            datasets: [
               {
                  spangaps: true,
                  label: 'Exceptionnel',
                  data: dataEu,
                  backgroundColor: 'transparent',
                  borderColor: '#00C853',
                  borderWidth: 4,
                  pointWidth: 3,
                  pointRadius: 5,
                  pointHoverRadius: 6,
                  pointBorderColor: '#FFF',
                  pointBackgroundColor: '#00C853',
                  pointBorderWidth: 1,
                  pointHitRadius: 100,
                  datalabels: {
                     display: false
                     }
                  }]}
});

假设
dataUs
dataEu
是带有值的数组,您可以使用如下javascript轻松访问和更改图表的数据:

myChart.data.dataset[0]。data=dataUs;//假设dataUs是一个数组
完成此操作后,您需要使用

myChart.update();
这是一个功能齐全的。可以随意操纵和玩弄它

myChart.update();