Graficar con arduino y processing

Para este tutorial usamos un sensor de temperatura LM35 tomando su lectura en la entrada A0 del arduino, el circuito es el siguiente:

Con el siguiente sketch de arduino enviamos las lecturas de la temperatura al monitor serial cada 100ms aproximadamente:

void setup() {
  // initialize serial communication at 9600 bits per second:
  Serial.begin(9600);
}

int valpwm;
float valtemp;

// the loop routine runs over and over again forever:
void loop() {
  int sensorValue = analogRead(A0); 

  valtemp = (sensorValue*500.00)/1023.00;
  delay(1); 
  Serial.println(valtemp);
  delay(100);
  
}

El resultado del monitor serial son los valores de la temperatura capturados por el arduino, a continuación procedemos a crear el sketch en processing que nos permitira graficar estos valores en algo más atractivo:

// Graphing sketch


 // This program takes ASCII-encoded strings
 // from the serial port at 9600 baud and graphs them. It expects values in the
 // range 0 to 1023, followed by a newline, or newline and carriage return

 // Created 20 Apr 2005
 // Updated 18 Jan 2008
 // by Tom Igoe
 // This example code is in the public domain.

 import processing.serial.*;

 Serial myPort;        // The serial port
 int xPos = 1;         // horizontal position of the graph

 void setup () {
 // set the window size:
 size(800, 600);        

 // List all the available serial ports
 println(Serial.list());
 // I know that the first port in the serial list on my mac
 // is always my  Arduino, so I open Serial.list()[0].
 // Open whatever port is the one you're using.
 myPort = new Serial(this, Serial.list()[0], 9600);
 // don't generate a serialEvent() unless you get a newline character:
 myPort.bufferUntil('\n');
 // set inital background:
 background(0);
 textSize(32);
 }
 void draw () {
 // everything happens in the serialEvent()
 }

 float x1 = 0;
 float x2;
 float y1;
 float y2 = height / 2;


void escalax(){
  
}


void serialEvent (Serial myPort) {
 // get the ASCII string:
 String inString = myPort.readStringUntil('\n');

 if (inString != null) {
   // trim off any whitespace:
   inString = trim(inString);
   // convert to an int and map to the screen height:
   float inByte = float(inString); 
   
   fill(0);
   rect(0, 0, 100, 100);
   fill(204, 102, 0);
   text(inString, 10, 80); 
   inByte = map(inByte, 0, 70, 0, height);

   // draw the line:
   stroke(204);
   line(xPos - 10, y1, xPos, y2);
   
   y1 = y2;
   y2 = height - inByte;

   // at the edge of the screen, go back to the beginning:
   if (xPos >= width) {
   xPos = 0;
   background(0); 
 } 
 else {
   // increment the horizontal position:
   xPos+=10;
   }
 }
}

Tomando el ejemplo desde la página de arduino, lo modificamos un poco y voila, el resultado es una gráfica de la temperatura que se actualiza y se refresca automáticamente tomando las lecturas del arduino:

Con algunas mejoras podemos agregar una escala de grados y de tiempo, así como graficar algunos otros valores simultaneamente, pero eso será materia de otro tutorial, saludos y hasta la próxima!