Graficador de señales con processing (osciloscopio de mala calidad con arduino)

Hola nuevamente, hoy les traigo un graficador de señales (podría decirse que es un osciloscopio muuuuy precario y con una bajísima frecuencia de muestreo, que para fines de aprendizaje está bueno) que grafica en la computadora utilizando la herramienta llamada processing. Este ide es muy similar al de arduino y comparten bastantes funciones.

Este es el IDE del processing, muy similar al de arduino.

A continuación les dejo el programa en cuestión del processing.

import processing.serial.*;

Serial puerto;
long valor, x=25, valor1=10, alto, ancho, tiempo1;

long tiempo2=1000, z, tiempo, basura, nulo=0;
String valores;
boolean comprobacion=false;

 
void setup()
{
  size(900, 500);
  alto = height;
  ancho= width-200;
  background(0);
  puerto = new Serial(this, Serial.list()[0], 115200);
  dibujo();
  
}
void draw()
{
  

  if(puerto.available() > 0)
  {
    
    textSize(11);
    
    //valores=puerto.readStringUntil('\n');

    tiempo1 = int(trim("0"+puerto.readStringUntil(' ')));
    valor = int(map(int(trim("0"+puerto.readStringUntil('\n'))), 0, 1023, alto-20, 10));
    
    println(tiempo1+" "+tiempo2+" "+valor);
    stroke(0);
    fill(0);
    rect(ancho-45, 0, 50, 10);
    stroke(0, 255, 0);
    fill(255);
    text(map(valor, alto-20, 10, 0, 5), ancho-45, 10);
    text("v", ancho-10, 10);
    if(tiempo1 != nulo)
    {
      if((x+((tiempo1-tiempo2)*ancho/20000))>25)
      {
        line(x, valor1, x+((tiempo1-tiempo2)*ancho/20000), valor);
        x+=((tiempo1-tiempo2)*ancho/20000);
        valor1 = valor;
        tiempo2=tiempo1;
        //x++;
        valor=0;
        if((x==ancho-10)||(x>ancho-10))
        {
          dibujo();
          x=25;  
        }
      }
    }
    else
    {
      println("error tiempo");
    }
  }
  
  if(mousePressed && ((millis()-tiempo)>300))
  {
    tiempo = millis();
    println(botonpresionado(mouseX,mouseY, 720, 50, "botón"));
  }
  
}

void dibujo()
{
  int div = 11, ini = 20;
  clear();
  background(0);
  stroke(127, 34, 255);
  line(25, 10, 25, alto-20);
  line(25, alto-20, ancho-15, alto-20);
  for(int i = 0; i<div; i++)
  {
    line(ini, ((alto-30)/(div-1))*i+10, ini+10, ((alto-30)/(div-1))*i+10);
    text(5-i/2.0+"v", 0, ((alto-30)/(div-1))*i+15);
    line(((ancho-35)/(div-1))*i+25, alto-15, ((ancho-35)/(div-1))*i+25, alto-25);
    text(/*nf((ancho-30)/(div-1)*0.03*i, 1, 2)*/(i*2)+"s", ((ancho-35)/(div-1))*i+15, alto-0);
  }
  boton(720,50,"botón");
}

void boton(int x, int y, String texto)
{
  stroke(0);
  fill(50);
  rect(x,y,90, 30);
  fill(230);
  rect(x+3,y+3,84, 24);
  fill(0);
  textSize(15);
  text(texto,x+5,y+20);
}

boolean botonpresionado(int mx, int my, int x, int y, String texto)
{
  if (((mx>=x && mx<=x+90) && (my>=y && my<=y+30)))
  {
    return true;    
  }
  else
  {
    return false;
  }
  
}

Este programa nos va a crear la siguiente ventana (una vez que presionemos el botón de "play" que se encuentra en la esquina superior derecha):

como se puede ver tenemos la gráfica de la señal que lee el arduino y por otro lado tenemos un botón que si se explora un poco el lenguaje se podría hacer que haga cosas interesantes como un zoom o que cambie las escalas (bastante sencillo de implementar). Vale aclarar que este programa no funciona si no detecta un arduino conectado en el puerto usb de la computadora.

Para el arduino (en este caso un arduino leonardo) el programa es el siguiente:

void setup() {

  Serial.begin(115200);
}

void loop() {

  Serial.print(millis());
  Serial.print(' ');
  Serial.println(analogRead(A0));

  delay(50);

}

Estos programas se pueden editar rápidamente para obtener mejores resultados. Como nota, para un mejor muestreo de la gráfica, el tiempo se manda desde el arduino junto con el valor equivalente al de la tensión.

Por último pido disculpas si las instrucciones invaden otro campo, pero cambiarlo significaría que no se podría copiar el código y pegarlo en donde queramos porque habría saltos de línea por todos lados.