Как правильно передавать данные в ChartJS с разным количеством точек x (метки) и y (метки данных)

1

У меня есть набор данных, который имеет данные, подобные этому

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')]; 

Я подал данные на диаграмму, как это

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'
               }
            }
         }]
      },
   }
});

Тем не менее, я получаю данные только для первых четырех точек, т.е. Для каждой метки.

Здесь JSFiddle

Я хочу, чтобы данные были распределены для всех ярлыков, в этом случае одна точка данных для каждой (4/12) секунд и соответственно корректировала график.

Есть ли какой-либо возможный способ добиться этого без жесткого кодирования путем преобразования меток в миллисекунду?

  • 1
    Таким образом, каждая точка нуждается в ярлыке. Вы получаете только четыре очка, потому что вы кормите только четыре ярлыка. Вы должны пересчитать ваши значения для ваших потребностей, чтобы количество баллов было равно количеству меток.
  • 1
    Да, я скорректировал промежуток времени, чтобы соответствовать размеру данных на данный момент. Хотелось бы узнать альтернативу, если она существует.
Теги:
chart.js
momentjs
data-visualization

1 ответ

1
Лучший ответ

Я пошел вперед и жестко закодировал все это, затрачивая секунды на миллисекунды, чтобы создать массивы равной длины

Ещё вопросы

Сообщество Overcoder
Наверх
Меню