Using Serial data in real time?

Processing Electronics (Arduino, etc.)
1

Hi,

I have a project which uses data from the Serial port.
The sketch is the following:

// Processing code for this example

  // Tweak the Arduino Logo

  // by Scott Fitzgerald
  // This example code is in the public domain.

  // import the serial library
  import processing.serial.*;

  // create an instance of the serial library
  Serial myPort;

  // create an instance of PImage
  PImage logo;

  // a variable to hold the background color
  int bgcolor = 0;

  void setup() {
    size(1, 1);
    surface.setResizable(true);
    // set the color mode to Hue/Saturation/Brightness
    colorMode(HSB, 255);

    // load the Arduino logo into the PImage instance
    logo = loadImage("http://www.arduino.cc/arduino_logo.png");

    // make the window the same size as the image
    surface.setSize(logo.width, logo.height);

    // print a list of available serial ports to the Processing status window
    println("Available serial ports:");
    printArray(Serial.list());

    // Tell the serial object the information it needs to communicate with the
    // Arduino. Change Serial.list()[0] to the correct port corresponding to
    // your Arduino board.  The last parameter (e.g. 9600) is the speed of the
    // communication.  It has to correspond to the value passed to
    // Serial.begin() in your Arduino sketch.
    myPort = new Serial(this, Serial.list()[0], 9600);

    // If you know the name of the port used by the Arduino board, you can
    // specify it directly like this.
    // port = new Serial(this, "COM1", 9600);
    //myPort = new Serial(this, "/dev/ttyACM0", 9600);
  }

  void draw() {

    // if there is information in the serial port
    if ( myPort.available() > 0) {
      // read the value and store it in a variable
      bgcolor = myPort.read();
      // print the value to the status window
      println(bgcolor);
    }

    // Draw the background. the variable bgcolor contains the Hue, determined by
    // the value from the serial port
    background(bgcolor, 255, 255);

    // draw the Arduino logo
    image(logo, 0, 0);
  }

The problem with this code is that that it does not use the data which came from the Serial in real time but with a long time delay.
Otherwise, this is an Arduino project that uses Processing IDE and processing code.
It is a project 14 from the project book Arduino Starter Kit:
https://bastiaanvanhengel.files.wordpress.com/2016/06/arduino_projects_book.pdf

So how to use, or where in the processing code to use the

bgcolor = myPort.read();

read(); function so we get the values from the Serial port in real time?
Maybe must use the

frameRate(30);

function for this in the void setup() part?

1 Like
2

Hi csanyipal,

Can we also see the arduino side?
What kind of data are you sending?

3

Yes, of course, here is the code for Arduino IDE:

/*
  Arduino Starter Kit example
  Project 14 - Tweak the Arduino Logo

  This sketch is written to accompany Project 14 in the Arduino Starter Kit

  Parts required:
  - 10 kilohm potentiometer

  Software required:
  - Processing (3.0 or newer) http://processing.org
  - Active Internet connection

  created 18 Sep 2012
  by Scott Fitzgerald

  http://www.arduino.cc/starterKit

  This example code is part of the public domain.
*/


void setup() {
  // initialize serial communication
  Serial.begin(9600);
}

void loop() {
  // read the value of A0, divide by 4 and send it as a byte over the
  // serial connection
  Serial.write(analogRead(A0) / 4);
  //Serial.println(analogRead(A0) / 4);
  delay(1);
}
1 Like
4

I think the reason why it is not real time is because you are sending way too much data from your arduino.

You are almost sending a data every 2ms. If your draw() loop in processing take a bit more time than that then you wont have to time to read the data fast enough so it will keep accumulating in the buffer. In this case when you read the buffer it can be a data sent 2 seconds ago or even a minute ago.

There is 2 ways of solving this:

  • Do not send that many data. Send data only when the value you want to send is different from the previous one.
  • Be sure that your draw loop run faster than you send data. Basically, increase the delay value in your arduino code. 1 is really low and I don’t think that you need that much reactivity.
1 Like
5

Thank you!
I solve this like this, in the Arduino IDE code:

int oldpotmeter = 0;

void setup() {
  // initialize serial communication
  Serial.begin(9600);
}

void loop() {
  // read the value of A0, divide by 4 and send it as a byte over the
  // serial connection
  int potmeter = analogRead(A0) / 4;

  if ( potmeter != oldpotmeter ) {
      Serial.write(potmeter);
      //Serial.println(potmeter);
      delay(500);
      oldpotmeter = potmeter;
  }
}

It works!

2 Likes