Processing is a flexible software sketchbook and a language for learning how to code within the context of the visual arts. - processing.org
The coding language is similar to Arduino code.
To try to figure out Processing I followed the Arduino X Processing Tutorials that i found on DLO.
Arduino code
First i uploaded this Arduino code on my NodeMCU and used the LDR to receive data:
//ARDUINO CODE FOR ANALOG SENSOR
int sensorValue = 0;
void setup() {
Serial.begin(9600); //needs to match processing baudrate
}
void loop() {
//Serial.println(analogRead(A0)); // for debugging only
sensorValue = analogRead(A0); // store value in sensorValue
Serial.write(map(sensorValue, 0,1023,0,255)); // map to processing range
delay(50);
}
Processing code
Then i pasted this code in Processing:
//PROCESSING CODE FOR ANALOG SENSOR
import processing.serial.*;
Serial myPort;
int dataInput;
void setup() {
size(255,255);
//println(Serial.list()); //use to find list of your port addresses
String portName = "COM5"; //change to your own port address!
myPort = new Serial(this, portName, 9600); //needs to match arduino baudrate
}
void draw() {
background(0);
fill(255);
fill(color(145,102,12));
ellipse(width/2,dataInput, 20, 20); // use dataInput for y axis
println(dataInput);
}
void serialEvent(Serial myPort) {
dataInput = myPort.read();
}
I was not sure what was about to happen when i would run this code. It turned out to be a circle that goes up as soon as the values change:
More experimenting
Through Zoom i learned about processing and how to work with images. Sander had made something with which you see the sun rise in an image and I also wanted to make something similar like that. I made a moon from the view of a satelite that rises above earth.
It is important to set the size the same as the image size so it wil fit as a background image otherwise you won't see it. I changed the code in processing and this was what happened:
import processing.serial.*;
Serial myPort;
int dataInput;
PImage bg;
void setup() {
size(500,333);
//println(Serial.list()); //use to find list of your port addresses
String portName = "/dev/cu.SLAB_USBtoUART"; //change to your own port address!
myPort = new Serial(this, portName, 9600); //needs to match arduino baudrate
bg = loadImage("aardekopie.jpg");
}
void draw() {
background(bg);
fill(255);
fill(color(255,244,204));
ellipse(width/2,dataInput, 40, 40); // use dataInput for y axis
println(dataInput);
}
void serialEvent(Serial myPort) {
dataInput = myPort.read();
}