yes, that is clear, we do a running graph ( not clear screen || draw + background )
so you need to make a small rectangle ( to clear the old number ) and then the text
and for that need to change the fill color also 2 times
fill(255);
rect(width-100,2+i*dy0,96,16);
fill(0);
textSize(12);
text(nf(map(val[i],0,100,0,valunit[i]),1,1)+" "+units[i],width-95,15+i*dy0);
and with using rect ( 10pix wide ) for each reading could look like
and with lines between last ( need memory variable ) and new point
String[] list = new String[3];
String[] head = {" measure 1 "," measure 2 "," measure 3 "};
String[] units = {"m","cc","kg"};
float[] valunit = {20,600,100}; // high range in engineering units
int k = 5, dk=10;
int y0=120, dy0=120;
float[] val = new float[3];
float[] valold = new float[3];
void setup() {
size(800, 380);
//frameRate(5);
background(0, 200, 200);
fill(0);
textSize(15);
for (int i = 0; i<3; i++) text(head[i],width/2,18+i*dy0);
}
void draw() { // if new data from arduino Ain raw as string: ( here simulated values )
list[0] = str(400+200*sin(TWO_PI*k/100));//"1000";
list[1] = str(random(180, 200));
list[2] = str(random(500, 524));
for (int i = 0; i<3; i++) {
val[i] = map(int(list[i]), 0, 1023, 0, 100);
fill(255);
rect(width-100,2+i*dy0,96,16);
fill(0);
textSize(12);
text(nf(map(val[i],0,100,0,valunit[i]),1,1)+" "+units[i],width-95,15+i*dy0);
// clearing black rect
stroke(0);
fill(0, 0, 0);
rect(k-dk,y0+i*dy0,dk,-100);
// measuring val
stroke(0, 200, 0);
fill(0, 200, 0);
// line(k,y0+i*dy0,k,y0+i*dy0-val[i]);
// point(k, y0+i*dy0-val[i]); // PV plot as DOT
// rect(k-dk,y0+i*dy0,dk,-val[i]); // PV as rect
line(k-dk,y0+i*dy0-valold[i],k,y0+i*dy0-val[i]);
stroke(0);
fill(0, 0, 0);
// line(k+1, y0+i*dy0, k+1, y0+i*dy0-100); // to clear to black
// curcor line
stroke(0, 200, 200);
line(k+1, y0+i*dy0, k+1, y0+i*dy0-100); // to indicate cursor
valold[i]=val[i];
}
k += dk;
if ( k> width-5 ) k=5;
}