How to plot multiple data from serial port

Post date: May 05, 2015 12:29:49 AM

I modify some code that i found in the processing example ( i can't remember which one but it's in File/examples menu of processing) to draw two line from sensor reading from the arduino via a serial print.

I modify the code of my temp measurement code to print ln the value of the two temp sensor.

48 // Print result on serial port

49 Serial.println(temp1);

50 Serial.println(temp2);

Processing code

import processing.serial.*; // import the serial library Serial myPort; // The serial portint xPos = 1; // horizontal position of the graphint sensor=0; //count of sensor readingint maxSensor=1; //nb of sensor 1=2 sensorsfloat temp1=0; // temp1 from serial readingfloat temp2=0; //temp2 from serial readingvoid setup () { // set the window size: size(640, 480); // set inital background: background(0); drawGrid (); // sub to draw the grid drawYLabel(); //sub to draw the labels // List all the available serial ports println(Serial.list()); // my port on my PC is number 18 myPort = new Serial(this, Serial.list()[18], 9600); // create a serial object on port serial 18 at 9600 bps // don't generate a serialEvent() unless you get a newline character: myPort.bufferUntil('\n'); } void draw () { // everything happens in the serialEvent() } void serialEvent (Serial myPort) { // get the ASCII string: String inString = myPort.readStringUntil('\n'); println(inString); if (inString != null) { // trim off any whitespace: inString = trim(inString); // convert to an int and map to the screen height: float inByte = float(inString); if (sensor==0) { //temp1 reading temp1=inByte; sensor++; // next sensor } else if (sensor==1) { // temp2 reading temp2=inByte; sensor=0; // sensor cout reset } temp1 = map(temp1, 0, 50, 0, height); //mapping of temp from 0celsius to 50 celsius temp2 = map(temp2, 0, 50, 0, height); // draw the line: stroke(#FFFFFF); // color of the line temp1 strokeWeight(2); // thickness of the line point(xPos, height - temp1); // drawing the point temp1 stroke(#00FF00); // color of the line temp2 strokeWeight(2); //thicness of the line point(xPos, height - temp2); // drawing the point temp2 // at the edge of the screen, go back to the beginning: if (xPos >= width) { xPos = 0; background(0); drawGrid (); drawYLabel(); } else { // increment the horizontal position: xPos++; } } } void drawGrid() { fill(254); textSize(10); textAlign(LEFT, TOP); // Use thin, gray lines to draw the grid stroke(224); strokeWeight(1); // drawing of 10 lines for (int row = 0; row < 10; row++) { line(row * (width/10), height-10, row * 64, 0); } } void drawYLabel() { int[] YLabel=new int[5]; YLabel[0]=50; YLabel[1]=37; YLabel[2]=25; YLabel[3]=12; YLabel[4]=0; fill(254); textSize(10); textAlign(LEFT, TOP); // Use thin, gray lines to draw the grid stroke(224); strokeWeight(1); for (int col =0; col < 4; col++) { text(YLabel[col], 0, (height/4)*col); line(0, (height/4)*col, width, (height/4)*col); } }

Plotting Temp from arduino:

Conclusion:

Using the same method i can now plot as many curve as i want by reading the data coming from the serial port. The arduino code should send one data curve per line.

I still need to find a way to calibrate the X grid. I'll probably do that on the Arduino code and the processing code. If i serial print the data from arduino at a fix interval, i can then dividing this interval by the width of the processing screen to have a X scale of the grid.