Есть ли способ нарисовать правильные линии, связанные с правильными данными?

Question

Я использую код ниже, чтобы сделать 4 графика из картинки. Первый и второй граф получили по 3 строки, а последние 2 графика - по одной. Проблема в том, что все графики набирают одинаковое число. Этот номер всегда последний в функции:

function drawChart(number,number,number,number,number,number,number,number)

изображение 4 графиков:

google.charts.load('current', {'packages':['corechart']});

google.charts.setOnLoadCallback(drawChart);
var numbersFromLabView = [];
var arrayFromLabView = [];
var time = [];

// na click bottuna
$('.viewbutton').click(function() {
  // Zovi api 
  $('#portfolio').addClass('hidden');
  $('#element-di-zivi-aplikacija').removeClass('hidden');
  setInterval(getDataFromLabView, 2000);
});

function getDataFromLabView() {
  var jsonData = $.ajax({
    url: 'projectXHTTP',
    dataType: 'json',
    success: function (jsonArray) {

      var zadnjiBroj   = jsonArray[0];
      var zadnjiBrojy  = jsonArray[1];
      var zadnjiBrojz  = jsonArray[2];
      var zadnjiBrojxa = jsonArray[3];
      var zadnjiBrojya = jsonArray[4];
      var zadnjiBrojza = jsonArray[5];
      var zadnjiBrojxb = jsonArray[6];
      var zadnjiBrojyb = jsonArray[7];  

      drawChart(zadnjiBroj, zadnjiBrojy ,zadnjiBrojz, zadnjiBrojxa, zadnjiBrojya, zadnjiBrojza, zadnjiBrojxb, zadnjiBrojyb);

      $(document.querySelector('.current-number'))  .text(zadnjiBroj);
      $(document.querySelector('.current-numbery')) .text(zadnjiBrojy);
      $(document.querySelector('.current-numberz')) .text(zadnjiBrojz);
      $(document.querySelector('.current-numberxa')).text(zadnjiBrojxa);
      $(document.querySelector('.current-numberya')).text(zadnjiBrojya);
      $(document.querySelector('.current-numberza')).text(zadnjiBrojza);
      $(document.querySelector('.current-numberxb')).text(zadnjiBrojxb);
      $(document.querySelector('.current-numberyb')).text(zadnjiBrojyb); 
    }
  });
}

function drawChart(number,number,number,number,number,number,number,number) {
  var data1  = new google.visualization.DataTable();
  moment.locale('hr'); 
  time.push(moment());
  numbersFromLabView.push(number );
  data1.addColumn('string', 'Time of Day');
  data1.addColumn('number', 'struja 1');
  numbersFromLabView.forEach((number, key) =>  {
    data1.addRow([time[key].format('LTS'), number]);
  });

  var data2  = new google.visualization.DataTable();
  moment.locale('hr'); 
  time.push(moment());
  numbersFromLabView.push(number );
  data2.addColumn('string', 'Time of Day');
  data2.addColumn('number', 'struja 2');
  numbersFromLabView.forEach((number, key) =>  {
    data2.addRow([time[key].format('LTS'), number]);
  });

  var data3  = new google.visualization.DataTable();
  moment.locale('hr'); 
  time.push(moment());
  numbersFromLabView.push(number );
  data3.addColumn('string', 'Time of Day');
  data3.addColumn('number', 'struja 3');
  numbersFromLabView.forEach((number, key) =>  {
    data3.addRow([time[key].format('LTS'), number]);
  });

  var data4  = new google.visualization.DataTable();
  moment.locale('hr'); 
  time.push(moment());
  numbersFromLabView.push(number );
  data4.addColumn('string', 'Time of Day');
  data4.addColumn('number', 'napon 1');
  numbersFromLabView.forEach((number, key) =>  {
    data4.addRow([time[key].format('LTS'), number]);
  });

  var data5  = new google.visualization.DataTable();
  moment.locale('hr'); 
  time.push(moment());
  numbersFromLabView.push(number );
  data5.addColumn('string', 'Time of Day');
  data5.addColumn('number', 'napon 2');
  numbersFromLabView.forEach((number, key) =>  {
    data5.addRow([time[key].format('LTS'), number]);
  });

  var data6  = new google.visualization.DataTable();
  moment.locale('hr'); 
  time.push(moment());
  numbersFromLabView.push(number );
  data6.addColumn('string', 'Time of Day');
  data6.addColumn('number', 'napon 3');
  numbersFromLabView.forEach((number, key) =>  {
    data6.addRow([time[key].format('LTS'), number]);
  });

  var data7  = new google.visualization.DataTable();
  moment.locale('hr'); 
  time.push(moment());
  numbersFromLabView.push(number );
  data7.addColumn('string', 'Time of Day');
  data7.addColumn('number', 'snaga');
  numbersFromLabView.forEach((number, key) =>  {
    data7.addRow([time[key].format('LTS'), number]);
  });

  var data8  = new google.visualization.DataTable();
  moment.locale('hr'); 
  time.push(moment());
  numbersFromLabView.push(number );
  data8.addColumn('string', 'Time of Day');
  data8.addColumn('number', 'frekvencija');
  numbersFromLabView.forEach((number, key) =>  {
    data8.addRow([time[key].format('LTS'), number]);
  }); 

  // chart1
  var joinedData = google.visualization.data.join(data1, data2, 'full', [[0, 0]], [1], [1]);
  var joinedData2 = google.visualization.data.join(joinedData, data3, 'full', [[0, 0]], [1, 2], [1]);

  // chart2
  var joinedData3 = google.visualization.data.join(data4, data5, 'full', [[0, 0]], [1], [1]);
  var joinedData4 = google.visualization.data.join(joinedData3, data6, 'full', [[0, 0]], [1, 2], [1]);

  // stil
  var options = {
    background: 'transparent',
    title: 'Numeric values from LabView on time scale',
    height: '500px',
    width: '100%',
    interpolateNulls: true,
    hAxis: {
      title: 'Vrijeme',
    },
    vAxis: {
      title: 'Amplituda',   
    }
  }

  var chart  = new google.visualization.LineChart(document.querySelector('#chart_div'));
  var chart2 = new google.visualization.LineChart(document.querySelector('#chart_div2'));
  var chart3 = new google.visualization.LineChart(document.querySelector('#chart_div3'));
  var chart4 = new google.visualization.LineChart(document.querySelector('#chart_div4'));

  chart.draw(joinedData2, options);
  chart2.draw(joinedData4, options);
  chart3.draw(data7, options);
  chart4.draw(data8, options);
}

Мой пост в Google Chart может быть немного более понятным, так как я не могу поместить изображение и код здесь: https://groups.google.com/forum/?hl=hr#!topic/google-visualization-api/COqmaH-_myQ

Answer 1

аргументы функции drawChart имеют одно и то же имя -> number
они должны быть уникальными, просто используйте те же имена, которые вы объявили выше ...

с ...

function drawChart(number,number,number,number,number,number,number,number) {

на ...

function drawChart(zadnjiBroj, zadnjiBrojy ,zadnjiBrojz, zadnjiBrojxa, zadnjiBrojya, zadnjiBrojza, zadnjiBrojxb, zadnjiBrojyb)

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