I'm actually interested in knowing if doing isometric projection in OPENGL is possible as well. It's probably the only way I'll ever leave 2D.

I have this basic sketch below. It works fine as it is, but it gets really ugly when you try to use a fill().

int boxSize = 45;
float gridSize = 10;

float isoThetaX = -atan(sin(radians(45)));
float isoThetaY = radians(45);

void setup() {
    size(800, 800, P3D);
    smooth();
    ortho();
    noFill();
}

void draw() {
    background(255);
    translate(width / 2, height / 2);

    for (int i = 0; i <= gridSize; i++) {
        for (int j = 0; j <= gridSize; j++) {
            pushMatrix();
            
            translate(width / gridSize * i, height / gridSize * j);
            rotateX(isoThetaX);
            rotateY(isoThetaY);
            box(boxSize);
            
            popMatrix();
        }
    }    
}

hi,

whats wrong with ortho?
the following projection matrix and the commented ortho method have the same affect.

1. import processing.opengl.*;
2. PGraphics3D p3d ;
3. PGraphicsOpenGL pgl;
4. boolean opengl = !false;
5. void setup() {
6.   if (opengl) {
7.     size(500,500,OPENGL);
8.     pgl = (PGraphicsOpenGL) g;
9.     pgl.projection.set
10.     (
11.       0.0040,  0.0000,  0.0000,  -0.0000,
12.       0.0000,  0.0040,  0.0000,  -0.0000,
13.       0.0000,  0.0000, -0.0020, -1.0000,
14.       0.0000,  0.0000,  0.0000,  1.0000
15.     );
16.     // same as
17.     //ortho(-width/2, width/2, -height/2, height/2, 0, 1000);
18.   }
19.   else {
20.     size(500,500,P3D);
21.     p3d = (PGraphics3D) g;
22.     p3d.projection.set(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
23.   }
24.   printProjection();
25.   // just for testing:
    
26.   //camera(width/2, height/2, 1000, width/2, height/2, 0, 0,1,0);
27.   //println(mouseX*3);
28.   //frustum(-width/2, width/2, -height/2, height/2, mouseX*3, 0.0);
29. }
30. void draw() {
31.   background(0);
32.   noFill();
33.   stroke(255);
34.   pushMatrix();
35.     translate(width/2, height/2, 200);
36.     //  rotateX(radians(45));
37.     //  rotateY(radians(45));
38.     box(400);
39.   popMatrix();
40.  
41.   stroke(0,0,255);
42.   line(0,0, width, height);
43.   fill(255,0,0);
44.   ellipse(0,0, 10, 10);
45. }

Ooh, OK, I figure it's smarter to rotate the camera once instead of rotating every shape all the time. How do I position the camera to look like an isometric diagram? Basically, I need to do these rotations, but still have the "Y" axis of the cube point straight up and down.

Actually, would it be possible to create 3D geometry and get images similar to this?

 




This is what I got so far, which isn't much. Sorry, I'm new to working in 3D.

import processing.opengl.*;

void setup() {
    size(500, 500, OPENGL);
    setupIsoCamera();
}

void draw() {
    background(0);
    drawBox(0, 0);
    drawBox(width/2, height/2);
    drawBox(mouseX, mouseY);
}

void setupIsoCamera() {
    ortho(-width/2, width/2, -height/2, height/2, 0, 1000);
    printProjection();

    float isoThetaX = -atan(sin(radians(45)));
    float isoThetaY = radians(45);

    beginCamera();
    rotateX(isoThetaX);
    rotateY(isoThetaY);
    endCamera();
}

void drawBox(float x, float y) {
    pushMatrix();
    translate(x, y);
    box(50);
    popMatrix();
}

Thanks for digging this one up guys. And for providing some code. It turns out ortho() was not working correctly in the pre-release builds I was using, but on the latest stable release 1.5.1. thomas' code works great. I've been playing around with it and now it all makes a lot more sense. So I will be using ortho() after all. Thanks!

Ok, I had to go muck about with camera().

This way, you only have to setup the isometric projection once in setup() instead of every frame in draw().

void setupIsoCamera(float gridSize, boolean trueIsometric) {
    float isoTheta;

    if (trueIsometric) {
        //isoTheta = radians(35.264);
        isoTheta = atan(sin(radians(45)));
    }
    else {
        isoTheta = radians(30);
    }

    // opposite / adjacent = tan(theta)
    // opposite = adjacent * tan(theta)
    float adjacent = dist(gridSize, gridSize, gridSize/2, gridSize/2);
    float opposite = adjacent * tan(isoTheta);

    ortho(-width/2, width/2, -height/2, height/2, -10000, 10000);
    camera(gridSize, gridSize, opposite, // camera eye position   
        gridSize/2, gridSize/2, 0,     // points towards center of grid 
        0, 0, -1);                   // with Z axis pointing up
}