Cara memasukkan data dengan benar ke ChartJS dengan jumlah titik x(label) dan y(data) yang berbeda

Saya memiliki kumpulan data yang memiliki data seperti ini

var data =[10,30,20,50,80,60,120,40,20,90,30,10];
var labels = [moment("12:00:00", 'HH:mm:ss'),moment("12:00:01", 'HH:mm:ss'),moment("12:00:02", 'HH:mm:ss'),moment("12:00:03", 'HH:mm:ss')];

Saya memasukkan data ke chartJS seperti ini

var ctx = document.getElementById("myChart").getContext('2d');
var myChart = new Chart(ctx, {
   type: 'line',
   data: {
      labels: labels,
      datasets: [{
         label: 'Voltage Fluctuation',
         data: [10,20,30,40,50],
         borderWidth: 1
      }]
   },
   options: {
      scales: {
         xAxes: [{
            type: 'time',
            time: {
               unit: 'minute',
               displayFormats: {
                  hour: 'HH:mm:ss'
               }
            }
         }]
      },
   }
});

Namun, saya hanya mendapatkan data untuk empat poin pertama, yaitu untuk setiap label.

Inilah JSFiddle

Saya ingin data didistribusikan untuk semua label, dalam hal ini satu titik data untuk setiap (4/12) detik dan sesuaikan grafiknya.

Apakah ada cara yang mungkin untuk mencapainya tanpa melakukan hardcoding dengan mengonversi label ke format milidetik?


javascript chart.js data-visualization momentjs
person Saikiran    schedule 23.10.2017    source sumber
comment
Jadi setiap titik memerlukan label. Anda hanya mendapatkan empat poin karena Anda hanya memberi empat label. Anda harus menghitung ulang nilainya untuk kebutuhan Anda sehingga jumlah poin sama dengan jumlah label.   -  person Michael P    schedule 30.10.2017
comment
Yap, lama waktunya saya sesuaikan dengan ukuran datanya saat ini. Ingin tahu alternatifnya jika ada.   -  person Saikiran    schedule 30.10.2017

Jawaban (1)


arrow_upward
1
arrow_downward

Saya melanjutkan dan melakukan hardcode semuanya dengan memotong detik menjadi milidetik untuk membuat array dengan panjang yang sama

person Saikiran    schedule 11.11.2017