Array of values to polar distribution

Jotasolano

Hello!

I'd like to know if someone can help me with this really easy sketch. I took some values and created a polar graph on Excel to see how it would look but I want to do it in Processing because what I want is to have dots in the value points and a web of lines from every dot to every dot. The whole point is not the graph, but the shape that will derive from it. Please see pictures.

So I created this basic code in Processing with something I found in Processing.org:

float r1;
float r2;
float r3;

// Angle and angular velocity, accleration
float theta;
float theta2;
float theta3;
float theta_vel;
float theta_acc;

void setup() {
  size(800, 800);

  // Initialize all values
  r1 = 10;
  r2 = 140;
  r3 = 210;
  theta = -90;
  theta2 = -90+27.7;
  theta3 = -34.6;
}



void draw() {

  background(300);

  // Translate the origin point to the center of the screen
  translate(width/2, height/2);

  // Convert polar to cartesian
  float x = r1 * cos(radians(theta));
  float y = r1 * sin(radians(theta));

  float x2 = r2 * cos(radians(theta2));
  float y2 = r2 * sin(radians(theta2));

  float x3 = r3 * cos(radians(theta3));
  float y3 = r3 * sin(radians(theta3));


  // Draw the ellipse at the cartesian coordinate
  ellipseMode(CENTER);
  //noStroke();
  fill(200);
  ellipse(0, 0, 5, 5);
  ellipse(x, y, 16, 16);
  ellipse(x2, y2, 30, 30);
  ellipse(x3, y3, 50, 50);

  line(x, y, x2, y2);
  line(x2, y2, x3, y3);
  stroke(200);
}

And this gave me this result:

So then I took that static code and created this code:

float r;

// Angle, incremental
float theta;
float increment;

//letters array
int[] letters = { 1, 14, 21, 16, 14, 9, 16, 20, 16, 12, 1, 14, 16};
int count = 13; //the amount of values in the array
Node[] myNodes = new Node[count];




void setup() {
  size(800, 800);
  smooth();

  //setup node grid
  grid();

  // Initialize all values
  r = 0;
  theta = -90;
  increment = (theta+(360/count)); //the angular increment
}



void draw() {

  background(225);
  // Translate the origin point to the center of the screen
  translate(width/2, height/2);

  for (int y = 0; y < letters.length; y++) {  //this is obviously wrong!
    for (int x = 0; x < letters.length; x++) {
      float xPos = r * cos(radians(theta+increment);
      float yPos = r * sin(radians(theta+increment);
      ellipse(xPos, yPos, 20, 20);
      myNodesT[i] = new Node(xPos, yPos);
      i++;
    }
  }

}


void grid() {
  int i = 0; 
  for (int r= letters[0]; r < letters[12]; r++) {
    float xPos = r * cos(radians(theta));
    float yPos = r * sin(radians(theta));
    myNodes[i] = new Node(xPos, yPos);
    i++;
  }
}

So I created an array with the values, which become the r values on the loop of the function grid(). So I think I created the positions of all the 13 "nodes", but the loop to create the ellipses is clearly wrong.

I'm sorry about the long post, and I hope I make myself clear. Any help will be appreciated.

Thanks !

quark

I have not tried your code but I suspect the problem might be due to integer division.

In line 25 change360 with 360.0

Jotasolano

Hey,

I tried that, but I get the same error:

On line 38 i get, unexpected token: float.

I think the whole cycle is wrong,

  for (int y = 0; y < letters.length; y++) {
    for (int x = 0; x < letters.length; x++) {
      float xPos = r * cos(radians(theta+increment);
      float yPos = r * sin(radians(theta+increment);
      ellipse(xPos, yPos, 20, 20);
      myNodes[i] = new Node(xPos, yPos);
      i++;
    }
  }

I just don't know how to take the values from myNodes[i] = new Node(xPos, yPos); of grid()and place them into the x and y values of the ellipse argument.

GoToLoop

You've got 2 open parentheses, but only 1 close parenthesis! L-)

Jotasolano

Okay, I cleaned up the code. Again, yes I was missing a parenthesys but that's not the issue, that's a (yes, stupid) sintax error.

This is what I have now:

float r;

// Angle, incremental
float theta;
float increment;

//letters array
int[] letters = { 1, 14, 21, 16, 14, 9, 16, 20, 16, 12, 1, 14, 16};
int count = 13; //the amount of leters in "antoniosolano"
int [][] positions = new int [count][count];



void setup() {
  size(800, 800);
  smooth();

  //setup node grid
  grid();

  // Initialize all values
  r = 0;
  theta = -90;
  increment = (theta+(360.0/count)); //the angular increment
}



void draw() {

  background(225);
  // Translate the origin point to the center of the screen
  translate(width/2, height/2);

      for (int y = 0; y < positions.length; y++) {
        for (int x = 0; x < positions.length; x++) {
          float xVal = xPos;
          float yVal = yPos;
      ellipseMode(CENTER);
      ellipse(xVal, yVal, 20, 20);
      fill(200);
      i++;
    }
  }
}


void grid() {
  int ix = 0;
  int iy = 0; 
  for (int r= letters[0]; r < letters[12]; r++) {
    float xPos = r * cos(radians(theta));
    float yPos = r * sin(radians(theta));
    positions[ix][iy] = new positions [xPos][yPos];
    ix++;
    iy++;
  }
}

So I created this array: int [][] positions = new int [count][count]; and I assigned values in grid();

I'm not properly calling those values in draw() because it tells me it can't find anything called xPos. I think my error is here:

      for (int y = 0; y < positions.length; y++) {
        for (int x = 0; x < positions.length; x++) {
          float xVal = xPos;
          float yVal = yPos;

Now of course I need to reference the indexes of positions [xPos] and positions [yPos]but i don't know how to do it.

Any ideas? By the way, you can tell by now, I'm not a programmer, I'm a designer, so please don't be too hard on me.

_vk

xPos is local to grid() function. I didn't really understood this code.

The basic grid, could be draw with something like this:

size(300, 300, P2D);
translate(width/2, height/2);
PVector pPoint= new PVector(0., 0.);
background(255);
stroke(160);
strokeWeight(1.2);

int incr = 30;
for (int r = 30; r < incr*5; r+=incr) {
  for (float i = 0.0; i < 360*5; i+= (360.0/13.0)) { 
    float x = cos(radians(i)) * r;
    float y = sin(radians(i)) * r;
    PVector point= new PVector(x, y);
    if (i > 0 ) {
      line(point.x, point.y, pPoint.x, pPoint.y);
    } 
    pPoint.set(x, y);
  }
}

Jotasolano

Okay so after a lot of fiddling around, this is the code that works. In case someone else needs it.

void grid() {
  for (int i=0; i < count; i++) {
    float xPos = letters[i]*20 * cos(theta);
    float yPos = letters[i]*20 * sin(theta);
    positionsX[i] = xPos;
    positionsY[i] = yPos;
    theta+= increment;
  }
}

And to draw the ellipses:

  for (int i=0; i < count; i++) {
    float xVal = positionsX [i];
    float yVal = positionsY [i];
    noStroke();
    fill(50);
    ellipseMode(CENTER);
    ellipse(xVal, yVal, 12, 12);
  }