Chartjs-Problem displaying two graphs on a single chart using javascript and chart.js

by

0👍

✅

I managed to get the code working. Firstly sending the sensor values over the websocket:

 String json = "{\"value\":";
  json +=  Thermocouple->readCelsius();
  json += ",";
  json += "\"value2\":";
  json += double(thermocouple.readCelsius());
  json += "}"; 

  webSocket.broadcastTXT(json.c_str(), json.length());

Then parsing the json string and “extracting” the values:

webSocket.onmessage = function(event){
      var data = JSON.parse(event.data);
      console.log(data.value);
      console.log(data.value2);
      var today = new Date();
      var t = today.getHours()+ ":" + today.getMinutes() + ":" + today.getSeconds();
      addData(t, data.value, data.value2)
    }

I logged the values to the console just to make sure that the values were parsed correctly. Finally adding the data to the graph:

function addData(label, data, data2){

    if(dataPlot.data.labels.length > maxDataPoints)removeData();
    dataPlot.data.labels.push(label);//x-values
    dataPlot.data.datasets[0].data.push(data);
    dataPlot.data.datasets[1].data.push(data2);

    dataPlot.update();

  }

Leave a comment