Как обновить график. js график новыми данными? - PullRequest
Новая
       9

Как обновить график. js график новыми данными?

0 голосов
/ 26 апреля 2020

Привет! У меня есть диаграмма в диаграмме. js вот код: 

let myChart = document.getElementById('myChart').getContext('2d');
let newChart = new Chart(myChart, {
type: 'line',
data: {
    labels: ['1', '2', '3', '4', '5', '6', '7' ],
    datasets: [{
    data: [
        7.9,
        8.2,
        6.4,
        9.8,
        6.7,
        8.1,
        9.2
    ],
    fill: false,
    label: 'Time to complete'
    }

    ]
},
options: {
    title:{
    display: true,
    text: 'Time taken per sample'
    }
}
});

Это нормально отображается в моем браузере.

Я хочу динамически обновлять данные при Нажатие кнопки,

Я уже настроил эту функцию так, чтобы при нажатии моей кнопки я отправлял запрос на новые данные и возвращал их в форме JSON, которая выглядит как {data: [...]}.

Мой вопрос: как мне написать код, обновить диаграмму с новой информацией?

Вот что у меня есть: 

$(".newData").click(function() {

      request = $.ajax({
              url: '/update_data',
              type: "POST"
            });

       request.done(function(data){
            // Need to update chart here!
       });
  });

Я пытался $('myChart').data=data

Но, увы, это не сработало!

Я думаю, что это, вероятно, одна строка, но я не могу понять это. Есть и другие подобные вопросы, но, похоже, они имеют дело с добавлением данных и их анимацией, а это совершенно новые данные.

1 Ответ

0 голосов
/ 26 апреля 2020

обновление набора данных 

  newChart.data.datasets[0].data=data//your data coming from  service

, затем 

 newChart.update();
...