Same Code Different Output

[vsquared]

I frequently write code for both Processing java and Processing py5 and usually the outputs are pretty close as I would expect. However in the following example the outputs are significantly different and I don't understand why. Do you see any problem with my Py5 translation which could explain it?

Java version:

PShape ring;
float theta = 0.5;

void drawRing(float radius, float ht, int sides) {
  float angle = 0;
  float angleIncrement = TWO_PI / sides;
  ring = createShape();
  ring.beginShape(TRIANGLE_STRIP);
  for (int i = 0; i <= sides; ++i) {
    ring.vertex(radius*cos(angle), 0, radius*sin(angle));
    ring.vertex(radius*cos(angle), ht, radius*sin(angle));
    angle += angleIncrement;
  }
  ring.endShape();
  ring.setStroke(false);
  for (int i = 0; i < ring.getVertexCount(); i++) {
    ring.setFill(i, color(random(255), random(255), random(255)));
  }
}

void setup() {
  size(600, 600, P3D);
  drawRing(100, 20, 24);
}

void draw() {
  background(209);
  translate(width/2, height/2);
  rotateX(map(mouseY, 0, height, PI, -PI));
  rotateY(map(mouseX, 0, width, -PI, PI));
  scale(2);
  for (float ang = 0; ang <= 355; ang +=5.0) {
    rotateX(theta);
    rotateY(theta);
    shape(ring);
  }
}

Java output:

Py5 version:

# Uses Imported mode for py5

theta = 0.5

def drawRing(radius, ht, sides):
  global ring
  angle = 0
  angleIncrement = TWO_PI / sides
  ring = create_shape()
  ring.begin_shape(TRIANGLE_STRIP)
  for _ in range(sides):
    ring.vertex(radius*cos(angle), 0, radius*sin(angle))
    ring.vertex(radius*cos(angle), ht, radius*sin(angle))
    angle += angleIncrement  
  ring.end_shape()
  ring.set_stroke(False)
  ring.set_fills(color(random(255), random(255), random(255))for _ in range(48))
  
def setup() :
  size(600, 600, P3D)
  drawRing(100, 20, 24)

def draw():
  background(209)
  translate(width/2, height/2)
  rotate_x(remap(mouse_y, 0, height, PI, -PI))
  rotate_y(remap(mouse_x, 0, width, -PI, PI))
  scale(2)
  for ang in range(0, 355, 5):
    rotate_x(theta)
    rotate_y(theta)
    shape(ring)

Py5 output:

[GoToLoop]

for (float ang = 0; ang <= 355; ang += 5) {

Why are you declaring ang as float if you're increment it by 5, which is an int? 🤨

[hx2A]

try generating all of the vertices in one 2D numpy array

Wouldn't you still need a 'for' loop to fill the numpy array?

No, you can use "vectorized" operations. For example, you can get all of the x and y coordinates with statements like this:

angleIncrement = TWO_PI / sides
x_coords = radius * np.cos(angleIncrement * np.arange(sides))
y_coords = radius * np.sin(angleIncrement * np.arange(sides))

[vsquared]

I'm sorry, but I just don't see how this helps. I need vertices, not x,y coordinate arrays. There's a top circle and a bottom circle connected with a TRIANGLE_STRIP which is actually the center band of a cylinder.

[hx2A]

I'm sorry, but I just don't see how this helps. I need vertices, not x,y coordinate arrays. There's a top circle and a bottom circle connected with a TRIANGLE_STRIP which is actually the center band of a cylinder.

Right, I didn't have time to work out a full solution to your code. I wanted to demonstrate what vectorized operations look like. That above code calculates values for all of the vertices in one shot, without a for loop.

I haven't tested this, but I believe this code snippet would be helpful.

x_coords = radius * np.cos(angleIncrement * np.arange(sides))
y_coords = ht * (np.arange(sides) % 2)
z_coords = radius * np.sin(angleIncrement * np.arange(sides))
vertices = np.stack([x_coords, y_coords, z_coords]).T

There might be more compact ways of accomplishing the same thing, but that is good enough for now.

Then you could use the vertices array like this:

ring = py5.create_shape()
ring.begin_shape(py5.TRIANGLE_STRIP)
ring.vertices(vertices)  # this passes all of the vertex coordinates at once, replacing your loop
ring.end_shape()
ring.set_stroke(False)
ring.set_fills(color(random(255), random(255), random(255))for _ in range(48))

Observe the lack of a for loop anywhere in that code.

[vsquared]

Observe the lack of a for loop anywhere in that code.
There's still one in draw(). 'for' loops have been around ever since I began programming in the 1980's so it's hard to believe that they are now poison, but I'm sure you've got a reason for not liking them. Python is a different cat. When I first saw the word 'numpy' I thought it was somebody's idea of a cute name for a library; it never occurred to me that it was a concatenation of 'num' + 'py'. I can't say that using it is intuitively obvious but like anything else has a learning curve.

Output with your snippet is correct:

[hx2A]

There's still one in draw()

True. But nested for loops are even worse. The problem is that the number of Java calls goes up exponentially when there are nested for loops, and that hurts performance.

'for' loops have been around ever since I began programming in the 1980's so it's hard to believe that they are now poison, but I'm sure you've got a reason for not liking them.

Inside numpy's c code for doing calculations on arrays, you will find for loops. Inside py5's code for processing the vertices array there are for loops. The difference between those for loops and a for loop in Python is that numpy's c for loop code and py5's java for loop code are both compiled and can be much much faster. The for loop didn't really disappear, it just moved to a place where it can be executed much faster.

Python is a different cat.

It certainly is! Vectorized operations is a good way of leveraging Python's strengths.

I can't say that using it is intuitively obvious but like anything else has a learning curve.

I agree, it isn't intuitively obvious. And when I started learning Python I was resistant to the idea of not writing Python code with for loops. But now I understand and see there are many benefits of learning to do it this way.