Code and Printer

Hi :smile:

I found a code that I really love but Iā€™m having troubles understanding it. Can anyone help me understand each line? And another question: I added a screenshot to the code and want this screenshot to be connected to a printer, which means the moment you click S it prints the screenshot.

Here is the Code:

import processing.serial.*;
Serial heartbeat; 
String val = "0.0"; // Wert von Arduino 


float bg = 20;
float s = 255;

float xoff = 0;
float yoff = 1000;

float fval = 0;
float fvalBuffer;

float u(float n) {
  return width/100 * n; //50 
}

void setup() {
  String portName = Serial.list()[7];
  heartbeat = new Serial(this, portName,9600);
  size(1000,1000);
  //pixelDensity(displayDensity());
  background(bg);
  strokeWeight(3);
  stroke(s);
  smooth();
}

void draw() {
  //arduino
  if(heartbeat.available() >0) 
  { 
    val=heartbeat.readStringUntil('\n');
    if(val != null && val != ""){
      fval = float(val);
     //langsamer 
      if(fval > 1){fval = 0.5;}
      
      if(fval > fvalBuffer){
        fvalBuffer = fval;
        fval = fval * 8;
      }
      
      if(fval < fvalBuffer){
        fvalBuffer -= 0.005f;
        fval = fvalBuffer * 8;
      }
    println(fval);
    }
}
  background(bg);
  for(float y = height*0.3; y < height*0.9; y += u(1.5)) { //height*0.1 
    pushMatrix();
    translate(20, y);
    noFill();
    beginShape();
    for(float x = width*0.1; x < width*0.9; x++) {
      float ypos = map(noise(x/100 + xoff, y/30 + yoff), 0, 1, -100, 100);
      float magnitude = x < width*0.5 ? map(x, width*0.1, width*0.5, 0, 1) : map(x, width*0.5, width*0.9, 1, 0) ;
      ypos *= magnitude *fval;
      if(ypos > 0) ypos = 0;
      vertex(x, ypos);
    }
    endShape();
    popMatrix();
  }
  
  xoff += 0.01;
  yoff += -0.01;
}

void keyPressed(){
  if (key=='s'||key=='S') 
                saveFrame();
}

Please format your code. In the PDE, you need to press ctrl+t. Here, you need to select your code and hit the </> button. Very simple.

What OS are you using?

Kf

Your code is still not formatted. Edit your post and try again.

Select your code.
Press the </> button.

Are you try to comment inside your code block?

For formatting your code here, you can edit your post, select the code block and hit the </> button right on top where you are writing your post, from that tool bar.

Another way is to use 3 back ticks to before and after your code like this


```java
[YOUR code here]
```

This post could be of interest when it comes to formatting code.

Kf

1 Like

I went ahead and formatted the post by highlighting the code and pressing the </> button.

// Use the serial library. Because we want to interact with a serial port.
import processing.serial.*;
// Our serial device is call heartbeat. 
Serial heartbeat; 
// We have a string for some value.
String val = "0.0"; // Wert von Arduino 

// there are othervariables too.
float bg = 20;
float s = 255;
float xoff = 0;
float yoff = 1000;
float fval = 0;
float fvalBuffer;

// There's a function, u(), that gives us an x position that's n% of the way across the screen.
float u(float n) {
  return width/100 * n; //50
}

// Here's setup. This happens once.
void setup() {
  // We find the right port we want from the list of ports.
  String portName = Serial.list()[7];
  // And set out serial thing to use that portname.
  heartbeat = new Serial(this, portName, 9600);
  // Here's size. This sets the sketch size. This really should be the first thing in setup().
  size(1000, 1000);
  //pixelDensity(displayDensity()); // comments don't do anything
  // We draw a dark background.
  background(bg);
  // We set the properties for lines we draw.
  strokeWeight(3);
  stroke(s);
  // We make the sketch not look aweful.
  smooth();
}

// Here's draw()! This runs over and over again to redraw our scene.
void draw() {
  //arduino
  // If we can read from our serial port,
  if (heartbeat.available() >0) 
  { 
    // Read a value.
    val=heartbeat.readStringUntil('\n');
    // If we got a value,
    if (val != null && val != "") {
      // Make that value be of the float type.
      fval = float(val);
      //langsamer 
      // If it's more than 1, make it a half.
      if (fval > 1) {
        fval = 0.5;
      }

      // Do something with a couple of variables if they have one relation.
      if (fval > fvalBuffer) {
        fvalBuffer = fval;
        fval = fval * 8;
      }

      // Do something else to them if the have a different relation.
      if (fval < fvalBuffer) {
        fvalBuffer -= 0.005f;
        fval = fvalBuffer * 8;
      }
      // Print out the value we read.
      println(fval);
    }
  }
  // Dark background again. Draw it. Yeah.
  background(bg);
  // Do a loop,
  for (float y = height*0.3; y < height*0.9; y += u(1.5)) { //height*0.1 
    pushMatrix(); // Remember this coordinate system.
    translate(20, y); // Adjust where (0,0) is.
    noFill(); // Draw shapes without any fill.
    beginShape(); // Start drawing a shape.
    // Do a second loop.
    for (float x = width*0.1; x < width*0.9; x++) {
      // Get a value that's based on random noise.
      float ypos = map(noise(x/100 + xoff, y/30 + yoff), 0, 1, -100, 100);
      // Work out a magnitude.
      float magnitude = x < width*0.5 ? map(x, width*0.1, width*0.5, 0, 1) : map(x, width*0.5, width*0.9, 1, 0) ;
      // Work out the y position.
      ypos *= magnitude *fval;
      // Make sure it's 0 or negative.
      if (ypos > 0) ypos = 0;
      // Put a vertex there. You're drawing a shape, remember?
      vertex(x, ypos);
    } // Stop that second loop.
    endShape(); // Stop drawing that shape.
    popMatrix(); // Put space back how you remembered it.
  } // Stop doing that first loop.

  // Move these offsets a bit.
  xoff += 0.01;
  yoff += -0.01;
} // The end of draw(). Drawing's all done, yo.

// If a key is pressed,
void keyPressed() {
  // And it's the s key,
  if (key=='s'||key=='S')
  // Save what's drawn to a file.
    saveFrame();
} // Don't do anything else when a key is pressed.

See comments explaining code, above.

So these for loops are drawing the lines, one line at the time and each is drawn from left to right and along the height of the sketch. Notice that the u() function is defining the vertical separation of those base lines. Each line will have a unique pattern defined by their associated perlin noise.

Related to fval in the block where fval is compared to fvalBuffer, it is not clear what this function does. I mean, it does some sort of comparisons. This is why it is important for people to comment their own code, so it makes sense when somebody else reads it. Notice that you can remove this code and define fval=0.5 and the code would still run and show all the lines and waves. The value of fval affects the amplitude shown in the sketch.

Kf

Thanks a lot for the help :pray:

Thank alot for the help :pray: