✊🏿 Black Lives Matter. Please consider donating to Black Girls Code today.
⚾️ It's finally Baseball season! Root for the home team... & Register for our Sports Analytics Webinar!

Multiple Traces in plotly.js with Ajax Call

EDIT: I figured it out!

Hi guys.
I’m working on a school project right now and I am struggling with this task.
I am working on an arduino project, that measures temperature and humidity.
In this step of the project, I am trying to graph the data (that is already stored on a server in a CSV file) with plotly.js.

I’ve researched about this topic for a while and found a way of using “Ajax Call” to enter my data from the CSV file into my the graph.
I have managed to get the graph working with one trace (either temperature or humidity) but cannot figure out a way to get it working with two traces (with both temperature and humidty).

In advance I have to say, that I am rather new to programming and would appreciate any help very much.

This is the graph for the temperature
And Humidity

Edit: I figured it out! :slight_smile:

This is the Code for the Graph with two traces, that I have been working on

      function makeplot() {
 	Plotly.d3.csv("http://angebote.zembi.ch/andi/luis/ma/Messdaten.csv", function(data){ processData(data) } );

function processData(allRows) {

	var n = [], t = [], x = [], h = [], standard_deviation = [];

	for (var i=0; i<allRows.length; i++) {
		row = allRows[i];
		n.push( row["n"] );
		t.push( row["t"] );
		x.push( row["n"] );
		h.push( row["h"] );
	console.log( 'X',n, 'Y',t,'1',x, '2',h, 'SD',standard_deviation );
	makePlotly( n, t, x, h, standard_deviation );
function makePlotly( n, t, x, h, standard_deviation ){
	var plotDiv = document.getElementById("plot");

	var trace1 = {
  x: n, 
  y: t, 
  type: 'scatter'

var trace2 = {
  x: n, 
  y: h, 
  type: 'scatter'

var data = [trace1, trace2, standard_deviation];
Plotly.newPlot('myDiv1', data);

This is an example of my CSV file


Thank you in advance, Luis