2d shapes on the zx plane

So the title basically explains my question, so I’m wanting to make a program that displays a circle on the x-z plane how would I do this without a rotation statement? Is it possible? I’ve done some researching and didn’t find anything that could help. Any thoughts? Kind regards, Code_X. also I am going to ask on an instant message based forum also so yeah, will up date this post if I get an answer from there.

What’s the point of the z-axis if you’re not using 3D?

1 Like

It’s not negative to use rotation. Why won’t you use it?
Just use rotateX etc.

You can look at shape3D library by quark to place a torus for example.

Of course you can calculate your own circle with a for loop and cos and sin - see tutorial trigonometry

Well, if I rotate the circle it will rotate this square I have, I promise this seems odd but I have a method to my madness. The square rotates along the y axis, this gave me the idea for the circle, it should be under the square for an affect idea I had because of the square. Sorry, I just finished your post, sorry, the trig idea isn’t bad, I love math. Thanks🙂

Okay, now I have a circle drawing algorithm, but it only makes a point, so what’s wrong? My code is:

//rotation angle varable
float angle =0.0;
//data variables for circle
float a,xCenter,zCenter,radius,xCoord,zCoord;

void setup(){


void draw(){


//creates the rotating square above the circle(also causes all other entities to rotate,working fine)

  angle +=0.03;

  //creates the circle(not working)
  for(int i=0; i < 360; i++){
    a = radians(i);
    xCenter = width/2;
    zCenter = 0;
  radius = 100;
  xCoord = xCenter + cos(a) + radius;
  zCoord = zCenter + sin(a) + radius;

Please help. Code_X


Your formula for a circle is incorrect.

Parametric Equation of a Circle

See this reference for the parameters available for beginShape() :

I often use POINTS to see just points; others (or no parameter) are for use as required for your shape.


Any 2D shape on the zx plane would be shown edge on the screen (xy plane). If you had a circle in the zx plane then you would see no change is you rotated about the X axis. But if rotated about the y axis then you would see a vertical ellipse with the major axis along the Y axis. It is simple enough to calculate the size of the minor axis and if using orthogonal view use the ellipse(…) statement to display it. If you wanted to include perspective then the maths is much more complicated.

I don’t fully understand but let me mention that you can isolate the rotations of different items against each other.

Basically you use pushMatrix then translate/ rotate for the circle then popMatrix().
When you then display the rect you start with a clean slate (no rotation).

You probably know this.

Also, sphere and box are in 3D.


I think its * radius not +

Here is an example of a lying red circle with pushMatrix / PopMatrix (no cos / sin trig)

ThreeD threeD = new ThreeD(); 
float angleBox; 

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

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

void draw() {


  // lying red circle 
  translate(width/2, height-200, 222); 
  stroke(255, 2, 2); 
  ellipse(0, 0, 100, 100);

  // blue box 
  fill(0, 0, 255);
  translate(width/2+180, height-270, 222); 

} // func 

// ==============================================

class ThreeD {

   This class shows different solids to draw in 3D.
   This class is not about one item (Car) but more a 
   collection of different commands for the realm of 3D. 
   section 1: reference section "2D Primitives" now in 3D
   section 2: reference section "3D Primitives" now in enhanced version 
   section 3: Platonic solids
   section 4: other, non platonic solids 
   section 5: coordinate system and related 
   section 6: HUD funcs / Head-up-Display funcs 
   section 7: floor
   section 8: minor help functions

  // 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); 

  // vars 

  boolean crosshair; 

  // section 7:
  // floor (later walls (but see coordinate system wall above), sky sphere...) --------------------------------

  void checkeredFloor() {


    for (int i = 0; i < 40; i = i+1) {
      for (int j = 0; j < 40; j = j+1) {

        // % is modulo, meaning rest of division
        if (i%2 == 0) {
          if (j%2 == 0) {
            fill (255, 0, 0);
          } else
            fill ( 103 );
        } else {
          if (j%2 == 0) {
            fill ( 103 );
          } else
            fill (255, 0, 0);
        } // if


        translate ( 40*i-20*20, height-150, 40*j-940 );
        box (40, 7, 40);

      } // for
    } // for
  } // method
} // class ThreeD
1 Like