Introduction to programming class 13

Introduction to Programming
Class 13
Paul Brebner

3d tutorial
• https://www.processing.org/tutorials/p3d/

2d -> 3d
• So far we’ve worked in 2d (x,y) dimensions
– E.g. Line, rectangles, ellipses, etc.
• How about 3d? (x,y,z)?
– Spheres, Cubes, etc
– Problem: Computer screen is 2d
– But Video card can display 3d world on 2d screen
• Tell Processing to use 3d
void setup()
{
size(200, 200, P3D); // 3rd parameter
}

3d co-ordinates and shapes
• X dimension is horizontal (+ to the right)
• Y dimension is vertical (+ down, - up)
• Z dimension is in/out (+ towards you, - away)
• 3d shapes are:
– box(size)
– sphere(size)
– Custom using vertex()
– Box and sphere only have 1 argument! Size
• How do you draw them in a (x,y,z) location???

Box (sketch_3dA)
void setup()
{
size(200, 200, P3D); // go 3d!
}
void draw()
{
background(0);
box(100); // where's my box? Try making it bigger
}

Translate – move the screen!
• All 3d objects are drawn at (0,0,0)
• To draw them somewhere else, move the
screen with the translate(x,y,z) function
void setup()
{
size(200, 200, P3D); // go 3d!
}
void draw()
{
background(0);
translate(50, 0, 0); // move screen 50 across
box(100);
}

Box (sketch_3dB)
void setup()
{
size(500, 500, P3D); // go 3d!
}
void draw()
{
background(0);
// translate(frameCount, 0, 0); // move in x direction only
// translate(0, frameCount, 0); // move in y direction only
// translate(0, 0, frameCount); // move in x direction only
// translate(frameCount, frameCount, 0); // move in x and y
// translate(frameCount, frameCount, frameCount); // x y and z
// translate(frameCount, frameCount, -frameCount); // vanishing act
translate(mouseX, mouseY, 0); // use mouse for x and y
box(100); // where's my box?
}

Box + rotate (sketch_3dC)
rotate(radians(degrees))
void setup()
{
size(500, 500, P3D); // go 3d!
}
void draw()
{
background(0);
translate(frameCount, frameCount, 0);
rotateX(radians(frameCount)); // let’s SPIN!
rotateY(radians(frameCount));
rotateZ(radians(frameCount));
box(100);
}

Box + scale (sketch_3dD)
scale(1, 1, 1) same size, scale(2, 2, 2)
x2 size etc
void setup()
{
size(500, 500, P3D); // go 3d!
}
void draw()
{
background(0);
scale(frameCount, frameCount, frameCount); // explode!
// scale(frameCount, frameCount/10, frameCount/10); // what does this do?
box(100);
}

Add some colour 3dE
void setup()
{
size(500, 500, P3D); // go 3d!
}
void draw()
{
background(0);
fill( frameCount * 3 % 255,
frameCount * 5 % 255,
frameCount * 7 % 255);
scale(frameCount, frameCount/10, frameCount/10);
box(1);
}

Lights 3dF
void setup()
{
size(500, 500, P3D); // go 3d!
}
void draw()
{
background(0);
translate(width/2, height/2, 0); // move it to the centre
if (mousePressed) lights(); // lights are turned off each frame, default
box(100); // try sphere();
}

Lights 3dG
Other lights
// ambient light just has a colour
ambientLight(0,0,255); // RGB arguments for blue ambient
// directional light has colour and direction
directionalLight(0, 255, 0, 0, -1, 0); // RGB colour and direction (1,0,-1) for (x,y,z)
// spotlight has colour, location, direction, angle, concentration
spotLight(255, 0, 0, width/2, height/2, 400, 0, 0, -1, PI/4, 2);

Lights 3dG
void setup()
{
size(500, 500, P3D); // go 3d!
}
void draw()
{
background(0);
translate(width/2, height/2, 0); // move it to the centre
// directionalLight(0, 255, 0, 1, -1, -1);
spotLight(255, 0, 0, mouseX-(width/2), mouseY-(height/2), 400, 0, 0, -1, PI/4, 100);
// box(100);
sphere(100);
}

More
• Lights, camera, action
• camera() sets where the viewer is
• perspective() sets how far away you are
• texture() add image to 3d objects
• Try
– Java Examples, Demos, Graphics, Planets

Introduction to programming class 13

More Related Content

What's hot

Viewers also liked

Similar to Introduction to programming class 13

More from Paul Brebner

Recently uploaded

Introduction to programming class 13