HTML Canvas - Plot 2 Variables Against Each Other

Data management
,
1

Hi,

I successfully used an HTML canvas widget to plot 2 of my variables together on the same chart. How can I plot their y values against each other, though (no timestamps)? It seems that getDataFromVariable function creates a trace for the chart in itself but I am not sure how to combine 2 of them…

I am using the Plotly example shown here: HTML Canvas Widget: Examples | Ubidots Help Center

I’m really unsure of how to go about this, but it must be possible… I need to plot data against something other than the timestamp at which Ubidots recieved the data, and Ubidot’s scatterplot widget is not customizable like I need it to be.

Here is the end portion of my code that I’ve been playing with for some time now:

Plotly.plot('plotlyDiv', [], layout);

getDataFromVariable(VARIABLE, TOKEN, function (values) {
  var tempvalues = {
    x: [],
    y: [],
    mode: 'lines',
  	type: 'scatter',
    name: 'TEMP VALUES'
  };

   var data2 =  values.forEach(function (value) {
       tempvalues.y.push(value.value);
   
  });

  getDataFromVariable(VARIABLE2, TOKEN, function (values) {
  var timestamps = {
    x: [],
    y: [],
    mode: 'lines',
  	type: 'scatter',
    name: 'TEMP VALUES'
  };

   var data1 =  values.forEach(function (value) {
       timestamps.y.push(value.value);
   
  });

  var trace = {
      x: data1,
      y: data2,
      mode: 'lines',
      type: 'scatter'
  };
  

  Plotly.addTraces('plotlyDiv', trace)