Inverting graphics and code

Processing Coding Questions
1

Hello,

I am new to processing, but not so much coding as i have done a 2 years of audio process design and implementation at my current university, using c and c++ languages.

However i am getting into the graphics world, i have created this code, which currently takes up half of the screen, the left hand side, with the the use of width/2 in the for loop.

How do i invert the graphic and procedure in the code so that the graphic does this on the other half of the screen?

Thanks, this is my first time posting so bare with me if i do not understand nor am able to impliment any of the suggestion you kindly offer!

Lewis

(wasnt sure how to put the code into this post so ill just copy and paste it in)
:):):):):):):):):):):):):)))

float x = 0;
float spacing = 25;
float thickness = 25;

void setup(){
size(400, 300);
}

void draw(){
background(0);

spacing = spacing + random(-3,3);
thickness = thickness + random(-2,2);
x = thickness;

stroke(255);
strokeWeight(20);

for (float x = 0; x < width/2; x++){
line(x,0,x,height);
x = x + spacing;
}

2

try:

float spacing = 10;
float thickness = 1;

void setup() {
  size(400, 300);
  frameRate(0.3);
  stroke(255);
}

void draw() {
  background(0);

  spacing   = random(10, 50);
  thickness = random(1, 11);
  println("spacing: "+nf(spacing,1,1)+" white: "+nf(thickness,1,1));
  
  strokeWeight(thickness);
  for (float x = 0; x < width; x=x+spacing) {
    line(x, 0, x, height);
  }
}
3

Press Ctrl+T in the Processing IDE and use the </> button in the message editor.

4

@kll Can you please explain what your code does, or how it works?

5

Like this?

float x = 0;
float spacing = 25;
float thickness = 25;

void setup() {
  size(400, 300);
}

void draw() {
  background(0);
  spacing = spacing + random(-3, 3);
  thickness = thickness + random(-2, 2);
  x = thickness;
  stroke(255);
  strokeWeight(20);
  for (float x = 0; x < width/2; x++) {
    line(x, 0, x, height);
    line(width-x, 0, width-x, height);
    x = x + spacing;
  }
}

It’s not clear what you want, exactly… Can you post a mock-up image?

6

that version uses the for loop with

x = x + spacing
but not in the loop instead in the loopdefinition:

for (float x = 0; x < width; x=x+spacing)

so the spacing defines how many patterns are drawn

but the white lines are drawn at that spacing are made with the
by the OP defined random

strokeWeight(thickness);

i just try to interprete the original code.

as i got headache from testing i reduced the framerate
and so could also print some diagnostic to the console.

7

hello,
thanks for replying!

This is exactly what i was looking for, im currently comparing my attempt and this to see where i went wrong.

Are you familiar with Ryoji Ikeda, his test pattern series, specifically No.2 is what i am aiming for aesthetically

8

26

here is the referenced installation

9

Based on your image, it seems that you want horizontal lines and you want invert the color of each line grayscale on right side – so a white line becomes a black line; so brightness 255 becomes 255-255 (0), brightness 192 becomes 255-192 (63) etc. Is that right?

After watching it I’m still not sure how your example sketch or your photo relates to Ryoji Ikeda’s Test Pattern No.2.