# Wanting advise on how I could randomize my work more

**URL:** https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267
**Category:** Electronics (Arduino, etc.)
**Tags:** homework
**Created:** [March 13, 2019, 2:26pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267 "2019-03-13T14:26:21Z")
**Posts on this page:** 20
**Page:** 2

<div class="post-metadata">

### Author: ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [March 27, 2019, 3:47pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/21 "2019-03-27T15:47:52Z")

</div>

as you can see from TFGuy44 Code, peasyCam is not the only way to have 3D rotation.

He wrote his own rotation based on mouse.

> [@Help with Extrusion from 2D to 3D](https://discourse.processing.org/t/help-with-extrusion-from-2d-to-3d/9656/4):
>
> Right, well, the parameters to the box() function are the size of each box. Set x and y to 1, and vary the z size based on the brightness. You also want to adjust the position because boxes are drawn from their centers: PImage img; boolean mono = false; void setup() { size(600, 400, P3D); img = loadImage("http://www.tfguy44.com/MyIcon1.PNG"); img.loadPixels(); noStroke(); } void draw() { background(mono?127:0); lights(); translate(width/2, height/2); rotateX(-map(mouseY,0,heig…

---

<div class="post-metadata">

### Author: ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [March 27, 2019, 8:02pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/22 "2019-03-27T20:02:58Z")

</div>

here is an example of mouse rotation without _peasyCam_ based on TFGuy44’s Code

```auto
void setup() {
  size(600, 400, P3D);
  background(0);
}

void draw() {
  background(0);
  lights();

  // the core idea: 
  setRotationAccordingToMouse();

  // Example shape 
  drawBoxWithSphere();
}

// -----------------------------------------------------------------

void setRotationAccordingToMouse() {
  // rotate and text out the two angles

  // calc angles
  float xAngle = map(mouseX, 0, width, -PI, PI) ; 
  float yAngle = -map(mouseY, 0, height, -PI, PI);

  // text out the two angles
  showAnglesAsText(xAngle, yAngle);

  // rotate
  translate(width/2, height/2, 0);
  // angles swapped! 
  rotateX(yAngle); // up/down
  rotateY(xAngle); // left/right
}//func 

void drawBoxWithSphere() {
  pushMatrix();
  // Box
  fill(255, 0, 0); // RED 
  noStroke();
  box(60, 70, 50);

  // Sphere 
  translate(0, -49, 0);
  fill(0, 255, 0); // Green 
  sphere(20); 

  popMatrix();
} // func 

void showAnglesAsText( float xAngle, float yAngle ) {
  // text out the two angles
  fill(255); // WHITE 
  text( int(degrees(xAngle))
    +"° | " 
    +int(degrees(yAngle))
    +"°", 
    20, 20);
} // func
//

```

---

<div class="post-metadata">

### Author: ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)
#### Post date: [March 28, 2019, 9:46pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/23 "2019-03-28T21:46:10Z")

</div>

> [@anon98404100](#):
>
> The line **always** moves to the lower-right corner

Your design is assuming that your values will be evenly distributed (equal number of lefts and rights, or ups and downs) – but they are not, even if all values are randomly generated. For previous discussion and workarounds / solutions for that general issue, see:

- [Why does it seem the noise() method is negatively biased? - Processing 2.x and 3.x Forum](https://forum.processing.org/two/discussion/comment/109333/#Comment_109333)

In general, don’t accumulate long series of random values – make them independent – and you won’t get tendencies over time that converge in one direction.

---

<div class="post-metadata">

### Author: ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [March 29, 2019, 12:09pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/24 "2019-03-29T12:09:40Z")

</div>

Been thinking about how to go 3D in terms of your sketch regarding to #3.

You could distinguish between upper case and lower case letter.

When the new letter is upper case and is smaller than the previous one, turn left by 90 degrees otherwise right 90 degrees. Using rotateY.

Now using rotateX you can use lower case and check if the letter is smaller or bigger and turn the angle UP 90 degrees or DOWN 90 degrees.

Then just draw a straight line with this rotation and store it in your ArrayList.

---

<div class="post-metadata">

### Author: ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [March 29, 2019, 12:20pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/25 "2019-03-29T12:20:16Z")

</div>

> [@Chrisir](#):
>
> The harder part is that at the moment all lines are in one plane. So to look at it in 3D might be boring. To make this interesting we would need a drawing in 3D space instead of in a 2D plane only. This is a bit tricky because for 3D you have at least 2 angles, left/right (like now) and up/down (new). You could for example use all small letters for the 1st angle and all capital letters for the 2nd angle.

When I wrote #3 I was referring to this text section

---

<div class="post-metadata">

### Author: ![anon98404100](https://avatars.discourse-cdn.com/v4/letter/a/b3f665/32.png) [@anon98404100](https://discourse.processing.org/u/anon98404100)
#### Post date: [April 1, 2019, 12:58pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/26 "2019-04-01T12:58:56Z")

</div>

apologies for the late response.

1. With “If it’s uppercase and **is smaller/bigger than the previous letter…** ”. Do you mean with the “smaller/bigger than” part the value minAngle/maxAngle value?
2. What exactly do I need to rotate to get the desired effect? do i need to rotate the `float x` and `float y` (which are used in a formula like `float x = r * cos(radians(angle+offset)) ;`); or do I rotate the angle?

---

<div class="post-metadata">

### Author: ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [April 1, 2019, 2:46pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/27 "2019-04-01T14:46:26Z")

</div>

1. 

just if the ascii of the letter is \> or \< than the prev letter.

The approach is a little different, instead of using all angles in the circle we just turn left or right 90 degree

1. 

No, it’s a new approach without sin and cos  
It’s essentially a 3D Turtle (see LOGO In Wikipedia) or a 3D L-System. I have just hard coded the letters wasdf but you can also do a \< \> check as I described. You could also map the ascii to angles and use in the rotations

see here

```auto

// with thanks to jeremydouglass for 3D Turtle (see Logo) 

void setup() {
  size(900, 900, P3D);
  textMode(MODEL);
}

void draw() {
  background(255);

  fill(0);
  text("rotate with mouse", 22, 22);

  lights();

  String list = "wasdwafffffsdwasdwasdwasdwasdwasd"; 

  setRotationAccordingToMouse();

  translate(width/2, height/2); 

  fill(0, 255, 0);//green  
  noStroke();
  sphere(12);

  stroke(0);
  strokeWeight(2);

  for (char c : list.toCharArray()) {

    //drawing a line is always moving forward (x,0,0). 
    tLine (100);

    switch(c) {
    case 'w' :
      rotateZ( radians( 90 ) );
      break; 
    case 's' :
      rotateZ( radians( -90 ) );
      break; 

    case 'a' :
      rotateY( radians( 90 ) );
      break; 
    case 'd' :
      rotateX( radians( -90) );
      break;

    case 'f':
      //ignore
      break;
    }// switch
  }//for

  fill(255, 0, 0);//red  
  box(12);
}

// ---------------------------------------------------

void tLine(int x) {
  line(0, 0, 0, x, 0, 0);
  translate(x, 0, 0);
}

void tStep(int x) {
  translate(x, 0, 0);
}

void setRotationAccordingToMouse() {
  // rotate and text out the two angles

  // calc angles
  float xAngle = map(mouseX, 0, width, -PI, PI) ; 
  float yAngle = -map(mouseY, 0, height, -PI, PI);

  // text out the two angles
  showAnglesAsText(xAngle, yAngle);

  // rotate
  translate(width/2, height/2, 0);
  // angles swapped! 
  rotateX(yAngle); // up/down
  rotateY(xAngle); // left/right
}//func 

void drawBoxWithSphere() {
  pushMatrix();
  // Box
  fill(255, 0, 0); // RED 
  noStroke();
  box(60, 70, 50);

  // Sphere 
  translate(0, -49, 0);
  fill(0, 255, 0); // Green 
  sphere(20); 

  popMatrix();
} // func 

void showAnglesAsText( float xAngle, float yAngle ) {
  // text out the two angles
  fill(255); // WHITE 
  text( int(degrees(xAngle))
    +"° | " 
    +int(degrees(yAngle))
    +"°", 
    20, 20);
} // func
//

```

---

<div class="post-metadata">

### Author: ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [April 1, 2019, 4:42pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/28 "2019-04-01T16:42:26Z")

</div>

You could also use peasycam instead of the mouse function

There also is a rotateX and a rotateY, not the same for letters a and d

There are 6 rotations

---

<div class="post-metadata">

### Author: ![anon98404100](https://avatars.discourse-cdn.com/v4/letter/a/b3f665/32.png) [@anon98404100](https://discourse.processing.org/u/anon98404100)
#### Post date: [April 3, 2019, 12:21pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/29 "2019-04-03T12:21:17Z")

</div>

Is it possible to change the PeasyCam handling to another button? For example, instead of using the middle-mouse to pan left/right/up/down, can I asign it to like the arrow keys?

---

<div class="post-metadata">

### Author: ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [April 3, 2019, 12:40pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/30 "2019-04-03T12:40:15Z")

</div>

I think so

Check the documentary

Google peasyCam

[http://mrfeinberg.com/peasycam/reference/index.html](http://mrfeinberg.com/peasycam/reference/index.html)

Chrisir

---

<div class="post-metadata">

### Author: ![anon98404100](https://avatars.discourse-cdn.com/v4/letter/a/b3f665/32.png) [@anon98404100](https://discourse.processing.org/u/anon98404100)
#### Post date: [April 3, 2019, 2:20pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/31 "2019-04-03T14:20:04Z")

</div>

hmmmm i ran into something strange.

When I use my PowerShell code to use te powershell as a keylogger, get my .txt from it and save it + use it, for some reason the program won’t properly pick up on ascii values and wont create any turns, but it will act normal when i copy all the button input, open notepad myself, paste it in there and re-save under the same name.

Guess there is soething wrong with the .txt that Powershell makes?

---

<div class="post-metadata">

### Author: ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [April 3, 2019, 3:07pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/32 "2019-04-03T15:07:12Z")

</div>

I don’t know…

---

<div class="post-metadata">

### Author: ![anon98404100](https://avatars.discourse-cdn.com/v4/letter/a/b3f665/32.png) [@anon98404100](https://discourse.processing.org/u/anon98404100)
#### Post date: [April 3, 2019, 3:31pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/33 "2019-04-03T15:31:26Z")

</div>

Alright.

Well thanks for all the help. Sorry for bombarding you with so many questions. You sure helped me a ton.

---

<div class="post-metadata">

### Author: ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [April 3, 2019, 4:02pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/34 "2019-04-03T16:02:08Z")

</div>

maybe somebody else answers. Do you use loadStrings to load your code?

Meanwhile I have a new 3D demo

- you can use PeasyCam
- you can change size of graphic with 0,1,2,3,4… up to 9

Chrisir

```auto

// with thanks to jeremydouglass for 3D Turtle (see Logo) 
// drawLine/line3D was programmed by James Carruthers

// https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/16

// 3D Turtle (see LOGO) or L-Systems is steered by a text named list. 
// You can type it in (see cube example list!) or random generate.
// You can either show the entire list or let it grow step by step. 
// For the latter say upperBorder=0; at the end of setup() and use the timer in draw(). 

// You can change the scale with 0...9

import peasy.*;

PeasyCam cam;

// commands for the turtle 
String list;

// scaling 
int stepLength= 120;

// with a timer we slowly let the graphic grow (by increasing upperBorder)
int upperBorder; 
int timer; 

// consts
final color RED = color (255, 0, 0);
final color GREEN = color (0, 255, 0);
final color BLUE = color (0, 0, 255);

final color WHITE = color (255);
final color BLACK = color (0);
final color GRAY = color (111);

final color YELLOW = color (255, 255, 0);
final color YELLOWWARM = color (255, 245, 49); 
final color VIOLET = color (143, 0, 255);
final color INDIGO = color (111, 0, 255);
final color MAGENTA = color (255, 0, 255);
final color PINK = color (255, 192, 203); 

// ----------------------------------------------------------------------------------

void setup() {
  size(900, 900, P3D);
  textMode(MODEL);

  cam = new PeasyCam(this, 800);
  // cam.setMinimumDistance(50);
  // cam.setMaximumDistance(500);

  // cube example list
  // list = "fafafafafsfafafafafsfafafafafsfafafafaff"; // ; "fafdfafwfsfsf"; // "wasdwafffffsdwasdwasdwasdwasdwasd"; 
  // or make a random list
  list=makeRandomList(); 

  timer=millis(); // with a timer we slowly let the graphic grow (by increasing upperBorder)
}

void draw() {
  background(255);
  avoidClipping(); 
  lights();

  evalList(list);

  /*
  // with a timer we slowly let the graphic grow (by increasing upperBorder)
   if (millis()-timer > 390) {
   if (upperBorder < list.length())
   upperBorder++;
   timer=millis();
   }
   */
}

// ----------------------------------------------------------------------------------

void evalList(String list) {

  // green circle at start 
  fill(0, 255, 0);//green  
  noStroke();
  sphere(12);

  stroke(0);
  strokeWeight(3);

  for (int i=0; i<upperBorder; i++) {

    char c = list.charAt(i); 

    // eval
    switch(c) {
    case 'w' :
      rotateX( radians( 90 ) );
      break; 
    case 's' :
      rotateX( radians( -90 ) );
      break; 

    case 'a' :
      rotateY( radians( 90 ) );
      break; 
    case 'd' :
      rotateY( radians( -90) );
      break;

    case 'f':
      //drawing a line is always moving forward (x,0,0). 
      tLine (stepLength);
      break;

    case 'm':
      tStep(stepLength); 
      break;
    }// switch
    //
  }//for

  // red box at end 
  strokeWeight(1);
  stroke(0); 
  fill(255, 0, 0);//red  
  box(12);
}

// ---------------------------------------------------
// Turtle 

void tLine(int x) {
  // turtle line 
  // line(0, 0, 0, 0, 0, -x);

  line3D(0, 0, 0, 
    0, 0, -x, 
    9, BLUE);

  translate(0, 0, -x);
}

void tStep(int x) {
  // turtle step
  // move without drawing! 
  translate(0, 0, -x);
}

// ----------------------------------------------------------------------------------
// Inputs 
void keyPressed() {
  if (key>='0'&&key<='9') { 
    int value= int(key) - 48;
    println (value);
    stepLength = int ( value * 21.2 + 3 ) ;
  }
}

// ----------------------------------------------------------------------------------
// Tools

String makeRandomList() {

  String list="";

  for (int i=0; i<800; i++) {

    int rnd = int(random(0, 4) );

    switch(rnd) {
    case 0:
      list+="w";
      break; 
    case 1:
      list+="a";
      break; 
    case 2:
      list+="s";
      break; 
    case 3:
      list+="d";
      break; 
    case 4:
      //list+="m";
      break;
    default:
      //list+="w";
      break;
    }//switch
    list+="f";
  }//for

  // println(list);
  upperBorder=list.length();

  return list;
}

void avoidClipping() {
  // avoid clipping :
  // https : //
  // forum.processing.org/two/discussion/4128/quick-q-how-close-is-too-close-why-when-do-3d-objects-disappear
  perspective(PI/3.0, (float) width/height, 1, 1000000);
}//func

void line3D(float x1, float y1, float z1, 
  float x2, float y2, float z2, 
  float weight, color colorLine)
  // drawLine/line3D was programmed by James Carruthers
  // see http://processing.org/discourse/yabb2/YaBB.pl?num=1262458611/0#9 
{
  // scale(90);

  PVector p1 = new PVector(x1, y1, z1);
  PVector p2 = new PVector(x2, y2, z2);
  PVector v1 = new PVector(x2-x1, y2-y1, z2-z1);
  float rho = sqrt(pow(v1.x, 2)+pow(v1.y, 2)+pow(v1.z, 2));
  float phi = acos(v1.z/rho);
  float the = atan2(v1.y, v1.x);
  v1.mult(0.5);
  pushMatrix();
  PVector v2 = new PVector ( x1, y1, z1 );
  translate(v2.x, v2.y, v2.z);
  translate(v1.x, v1.y, v1.z);
  rotateZ(the);
  rotateY(phi);
  noStroke();
  fill(colorLine);

  box(weight, weight, p1.dist(p2));
  popMatrix();
} // method
//

```

---

<div class="post-metadata">

### Author: ![anon98404100](https://avatars.discourse-cdn.com/v4/letter/a/b3f665/32.png) [@anon98404100](https://discourse.processing.org/u/anon98404100)
#### Post date: [April 3, 2019, 6:41pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/35 "2019-04-03T18:41:08Z")

</div>

Holy moly that is impressive! Little too hard for me to understand yet hahaha.

And to answer your question, yes I do use loadstrings 😛

---

<div class="post-metadata">

### Author: ![anon98404100](https://avatars.discourse-cdn.com/v4/letter/a/b3f665/32.png) [@anon98404100](https://discourse.processing.org/u/anon98404100)
#### Post date: [April 4, 2019, 5:42pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/36 "2019-04-04T17:42:33Z")

</div>

My very last question, and to repeat myself: Thank you for all the help!

So I do not know if you personally worked with Arduino before, but I want/need to add the rotation of the camera to my Arduino button. I already checked as much of PeasyCam stuff as I could, but I do not think it would be possible.

In the None-peasycam alternative piece of code, I could change mouseX and mouseY to

```auto
float xAngle = map(arduinobutton1, .....);
float yAngle = map(arduinobutton2, .....);

rotateX(xAngle);
rotateY(yAngle);

```

Correct?

---

<div class="post-metadata">

### Author: ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [April 4, 2019, 5:58pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/37 "2019-04-04T17:58:07Z")

</div>

I worked with my arduino ages ago

Your assumption is correct

---

<div class="post-metadata">

### Author: ![anon98404100](https://avatars.discourse-cdn.com/v4/letter/a/b3f665/32.png) [@anon98404100](https://discourse.processing.org/u/anon98404100)
#### Post date: [April 4, 2019, 6:00pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/38 "2019-04-04T18:00:10Z")

</div>

Amazing! Thank you 🙂

---

<div class="post-metadata">

### Author: ![anon98404100](https://avatars.discourse-cdn.com/v4/letter/a/b3f665/32.png) [@anon98404100](https://discourse.processing.org/u/anon98404100)
#### Post date: [April 4, 2019, 8:49pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/39 "2019-04-04T20:49:34Z")

</div>

Okay… this is really my last question  
.  
So I am implementing just a simple zoom to the project, basically with ( **This is just the code that is added to the project** ) :

```auto
float zoom = 1;
boolean zoomIn = false;
boolean zoomOut = false;

void draw() {
translate(width, height);
scale(zoom);
zoomCamera();
}

void zoomCamera() {

if (zoomIn) {
 zoom += 0.03;
}

if (zoomOut) {
 zoom -= 0.03;
}
}

void keyPressed () {

if (key == 'j') {
 zoomIn = true;
 zoomOut = false;
}
if (key == 'k') {
 zoomIn = false;
 zoomOut = true;
}

void keyReleased() {

if (key == 'j') {
 zoomIn = false;

}
if (key == 'k') {
 zoomOut = false;
}
} 

```

And the issue is that I cannot get the ‘Translate’ right to show my sketch on my screen AKA I have to zoom in or out to find it. Would you know how to find the proper translate-coordinates or wont it be necessary? (I keep seeing Translate being used with a few videos).

---

<div class="post-metadata">

### Author: ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [April 5, 2019, 8:13pm UTC](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267/40 "2019-04-05T20:13:19Z")

</div>

I don’t know

…

[Previous page](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267.md?page=1)

[Next page](https://discourse.processing.org/t/wanting-advise-on-how-i-could-randomize-my-work-more/9267.md?page=3)
