Arduino Basics: Displaying Serial data from an Arduino UNO on your computer screen - using Processing

25 June 2011

Displaying Serial data from an Arduino UNO on your computer screen - using Processing

Here is a very basic Processing Sketch that will allow you to receive data from the Serial port attached to the Arduino and display the reading on your computer screen. In my case, the Arduino is connected to COM13. You may need to change this if you decide to follow in my footsteps.


You will need to setup an Arduino sketch to send serial data to the computer using a Serial.println(value) command. The processing sketch will look for the line feed character ' \n' coming from COM13, which will trigger a serialEvent(). You can get processing to look for another character if you want to: just change the character within the bufferUntil() command.
The draw() method is made redundant because the screen updating is handled by the serialEvent() in response to serial data communication with the Arduino UNO



Here is the Processing sketch code:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
import processing.serial.*;
Serial myPort;
String sensorReading="";
PFont font;


void setup() {
  size(400,200);
  myPort = new Serial(this, "COM13", 9600);
  myPort.bufferUntil('\n');
  font = createFont(PFont.list()[2],32);
  textFont(font);
}

void draw() {
  //The serialEvent controls the display
}  

void serialEvent (Serial myPort){
 sensorReading = myPort.readStringUntil('\n');
  if(sensorReading != null){
    sensorReading=trim(sensorReading);
  }

  writeText("Sensor Reading: " + sensorReading);
}


void writeText(String textToWrite){
  background(255);
  fill(0);
  text(textToWrite, width/20, height/2);   
}
This was formatted using this site.

If you want an Arduino project that goes well with this code, see this post.





Posted by Scott C at 6/25/2011 08:46:00 pm
Labels: , , , , , , , ,

18 comments:

  1. If you don't know what COM port to use, then you may wish to use

    println(Serial.list());

    to display the available COM ports that processing can communicate with. This was suggested by PaulS in the Arduino forum

    http://www.arduino.cc/forum/index.php/topic,72700.0.html

    ReplyDelete

  2. Good day. Thank you for this tutorial. I have a question about multiple readings. How do I display multiple readings from the arduino to processing. For example, I would like to display temperature sensor readings, rpm sensor readings and voltage sensor readings. How can this be done. Thank you

    ReplyDelete
    Replies

    1. This will eventually be covered in my progressive Serial Communication Tutorial which can be found here:

      http://arduinobasics.blogspot.com/2012/07/arduino-basics-simple-arduino-serial.html

      Delete

  3. u are smart, great article!!!!!!!!!!!!!!!

    ReplyDelete

  4. Dear Anonymous,
    I would say that you may have left out a bracket or semi colon or something like that. I am using a Windows PC, so not sure how you would do this with a MAC. If you still have no luck, then perhaps look to the Arduino Forums for more clues.

    ReplyDelete
    Replies

    1. Original comment by anonymous was deleted due to the size of the message.

      Delete

  5. Thanks a lot.

    If the serial setup can be done with:

    Serial.begin(9600);

    why to use:

    myPort = new Serial(this, "COM13", 9600);

    Is there any benefit?

    ReplyDelete
    Replies

    1. "Serial.begin(9600);" is used in the Arduino IDE, while
      "myPort = new Serial(this, "COM13", 9600);" is used in Processing.
      They are two different programming environments. The reason they look
      so much alike is that the Arduino IDE is based on Processing.

      Delete

    2. Thank you.

      When one should use Processing? And I think there is extra options in it? What is it?

      Delete

    3. Have a look at this site:
      http://www.processing.org/reference/libraries/serial/index.html

      Delete

    4. Thanks a lot, bookmarked.

      This can be useful when working with string - good function "readStringUntil", specially when reading also needed beside print. Probably the library is good for other projects too.

      Thanks again.

      ** The captcha with numbers is too small to read or understand.

      Delete

  6. Thanks for the feedback Anonymous. The captcha is only used when commenting under "Anonymous". This is a blogger/blogspot feature that I have no personal control over. However, I will feed it back to Google.

    ReplyDelete
    Replies

    1. Captcha feedback has been submitted to Google.

      Delete

  7. Thanks a lot Scott C, for informing google about captcha and your other helps. (I understand that you don't have anything to do to fix it, as it's up to google. But honestly, I am surprised to see that you care - that much! I asked the earlier questions as Anonymous, as now.)

    Keep up the good work, good man :). May God bless you.

    ReplyDelete

  8. this doesnt run at least for me it is stopping at sensorReading = myPort.readStringUntil('\n');

    ReplyDelete
    Replies

    1. Nevermind i figured it out that got taken out in the 2.1 version i went to the 2.0.3 and it works just fine now

      Delete

  9. This is the only code that i have seen that actually works great. Thank you very much!

    ReplyDelete

Feel free to leave a comment about this tutorial below.
Any questions about your particular project should be asked in the ArduinoBasics forum.

Comments are moderated due to large amount of spam.

Subscribe to: Post Comments (Atom)