Processing P3D not rendering properly - animation

I tried to make a simple 3d spinning cube in processing.
int size = 100;
float angle = 0;
void setup() {
size(500, 500, P3D);
}
void draw() {
lights();
translate(width/2, height/2, 0);
rotateY(angle);
rotateX(angle);
background(0);
box(size);
angle+=0.05;
}
When i run it, i got a nice spinning cube but there is some problem in rendering.
Found a similar thread with no answer:-
Processing P3D Animation leaving artifacts behind
Image Depicting the problem

Although I could not found the reason for this weird effect. But here is a quick hack which worked out for me.
Instead of using the background function to fill the background, simply draw a filled rectangle every frame.
int size = 100;
float angle = 0;
void setup() {
size(500, 500, P3D);
}
void draw() {
//black
fill(0);
//rectangle to fill the canvas
rect(0,0,width,height);
lights();
fill(255);
translate(width/2, height/2, 0);
rotateY(angle);
rotateX(angle);
box(size);
angle+=0.05;
}

Related

How to execute a function only once in voice draw(); but still have it displayed for the whole animation

I'm struggling with something here.
Basically I made an animation with several functions. I want the functions to be animated, except for one that I want to be still.
If I specify noLoop, then nothing gets animated, if I tell the function to run a set number of times, then after that number it stops being displayed. What I want is to have it run once but then be still displayed.
Do you guys have any idea of how I could do that ?
Here is the code :
int r1,r2,r3 = 0;
int i1, i2,i3;
void setup(){
size(800,800);
background(255,0);
//noLoop();
}
void draw(){
background(255,0);
rosace();
croix();
sillon1();
sillon2();
}
void rosace(){
for (i1 = 0;i1<230; i1++){
rectMode(CENTER);
noFill();
stroke(20);
strokeWeight(1);
pushMatrix();
translate(width/2,height/2);
translate(400,400);
rotate(radians(r1));
rect(0,0,400,400);
r1 +=1;
//println(r);
popMatrix();
println("rosace ex");
}
}
void croix(){
pushMatrix();
strokeWeight(2);
stroke(0);
translate(width/2, height/2);
rotate(radians(45));
line(-10,0,10,0);
line(0,-10,0,10);
popMatrix();
}
void sillon1(){
for (i2 =0; i2<360; i2++){
pushMatrix();
translate(width/2,height/2);
strokeWeight(int(random(0,7)));
rotate(radians(r2));
point(-330,0);
popMatrix();
r2 +=1;
}
}
void sillon2(){
for (i2 =0; i2<2000; i2++){
pushMatrix();
translate(width/2,height/2);
strokeWeight(int(random(1,3)));
rotate(radians(r2));
point(-360,0+(random(-2,2)));
popMatrix();
r2 +=1;
}
}
The void rosace(); is the one that I'd like to be non-animated.
The problem is that you're storing r1 as a global variable. This means that it keeps it's value after every iteration.
Instead, make it a local variable:
void rosace() {
int r1 = 0;
for (i1 = 0; i1<230; i1++) {
rectMode(CENTER);
noFill();
stroke(20);
strokeWeight(1);
pushMatrix();
translate(width/2, height/2);
translate(400, 400);
rotate(radians(r1));
rect(0, 0, 400, 400);
r1 +=1;
popMatrix();
println("rosace ex");
}
}
You can't just keep a part of the scene, when animations are drawn on top of it. You have to draw the entire scene in every frame. Ensure that rosace draws the same in every frame.
Just set r1 = 0 in every frame, then the algorithm in rosace generates the same rectangles in every frame:
void rosace(){
r1 = 0;
for (i1 = 0;i1<230; i1++){
// [...]
}
}

Processing P3D Animation leaving artifacts behind

I am trying to make a spinning cube in Processing's P3D with this code:
int sizes = 500;
int rotation = 0;
void setup() {
size(500, 500, P3D);
}
void draw() {
lights();
translate(sizes/2, sizes/2, 0);
rotateY(rotation * (PI/180));
rotateX(rotation * (PI/180));
background(0);
box(sizes/2);
rotation = (rotation + 1);
}
When I run it the cube does spin as I wanted, but there are strange 'artifacts' (for lack of a better name) left behind its edges.
What causes this issue, and can it be solved?
I tried this and it worked. Maybe instead of using backround(0), set every pixel to black like the background function does manually.
int sizes = 500;
int rotation = 0;
void setup() {
size(500, 500, P3D);
}
void draw() {
fill(255);
lights();
translate(sizes/2, sizes/2, 0);
rotateY(rotation * (PI/180));
rotateX(rotation * (PI/180));
loadPixels();
for(int i = 0; i < pixels.length; i++) pixels[i] = color(0);
box(sizes/2);
rotation = (rotation + 1);
}

How to create a mask from Polygons (processing)?

I am trying to create from a custom shape a mask for an image.
In processing I came up with this:
Image img;
PImage img2;
PGraphics mGraphic;
void setup(){
img = loadImage("mask.jpg");
img2 = loadImage("test.jpg");
mGraphic = createGraphics(1024,1024, JAVA2D);
size(img.width, img.height);
}
void draw(){
background(255);
mGraphic.beginDraw();
mGraphic.background(0);
mGraphic.ellipse(mouseX, mouseY, 400, 400);
mGraphic.endDraw();
img2.mask(mGraphic);
image(img2,0,0);
}
Above code will create a ellipse that will be the mask of the image.
I would like to achieve the same with a custom shape generated by Polygons:
import java.awt.Polygon;
PImage img;
PImage img2;
PGraphics mGraphic;
CustomShape myShape = new CustomShape();
void setup(){
img = loadImage("mask.jpg");
img2 = loadImage("test.jpg");
mGraphic = createGraphics(1024,1024, JAVA2D);
myShape.addPoint(25, 25);
myShape.addPoint(275, 25);
myShape.addPoint(275, 75);
myShape.addPoint(175, 75);
myShape.addPoint(175, 275);
myShape.addPoint(125, 275);
myShape.addPoint(125, 75);
myShape.addPoint(25, 75);
smooth();
// img2.filter(INVERT);
size(img.width, img.height);
}
void draw(){
background(255);
stroke(0);
myShape.display();
img2.mask(myShape);
image(img2,0,0);
}
class CustomShape extends Polygon {
void display() {
stroke(0);
fill(0);
beginShape();
for (int i=0; i<npoints; i++) {
vertex(xpoints[i], ypoints[i]);
}
endShape(CLOSE);
}
}
Unfortunately, this code will give me an error: The method mask(int[]) in the type PImage is not applicable for the arguments (Masking_image_1.CustomShape)
Is this even possible to get the same result as my first code, but then with the use of a custom shape? And how can I solve that?
If there are any questions left, please let me know. Above code will work inside Processing.
Well, your error says it all: the mask() function does not know what to do with a CustomShape parameter. The parameter needs to be a PImage or a mask array. More info can be found in the reference.
To use your custom shape, what you want to do is draw that custom shape to a PGraphics (which is a subclass of PImage), and then use that PGraphics as the mask. You'd do that using the createGraphics() function. Again, more info can be found in the reference.

Local Axis Rotation OBJ import Processing

I am trying to rotate an OBJ from maya around an axis in Maya. It works just fine with a sphere, but with my own object - it is following an orbit. Maybe I don't understand the shape(parameters).
PShape s;
float theta = 0;
void setup() {
size(500, 500, P3D);
shapeMode(CENTER);
s = loadShape("obj2.obj");
}
void draw() {
background(32);
lights();
float z = 0;
pushMatrix();
translate(0,height*1/4);
rotateY(theta);
theta += .01;
scale(4.0);
box(100);
//shape(s, 0,0);
popMatrix();
}
here is the object: https://drive.google.com/open?id=0B3ddDpsAjuqPYUR6RHd0OFBfVU0
Take out this line of code:
shapeMode(CENTER);
For some reason, this line of code is causing the offset you're seeing. I'm not sure exactly why this causes the offset, but getting rid of it seems to fix your problem.
There is a good simple example of loading and displaying a 3d shape in the examples that come with the Processing editor. Just go to File > Examples and then go to Basics > Shape > LoadDisplayOBJ.
Kevin is right, part of the problem is shapeMode(CENTER).
Additionally you may want to double check if the mesh is centered in your editor.
I've imported your mesh in Blender, and although there is a difference in scale, the origin of your geometry was not at 0,0,0
Here's a tweaked version of your .obj and .mtl exported from Blender after manually translating the mesh so it's closer to the center:
PShape s;
float theta = 0;
void setup() {
size(500, 500, P3D);
s = loadShape("coral.obj");
}
void draw() {
background(32);
lights();
float z = 0;
pushMatrix();
translate(width * .5,height* .5);
rotateY(theta);
theta += .01;
scale(50.0);
shape(s, 0,0);
popMatrix();
}
Additionally you can manually compute the mesh bounding box and centroid to orbit around that position, or look a library that provides this functionality.

How to fill the color inside the curve?

I want to create a picture that has some closed areas using function curve(...), but I do not know how to fill the color inside.
Is there any way to fill inside the head and body?
void setup(){
size(800,800);
}
void draw(){
background(170,243,255);
fish();
}
void fish(){
translate(width/2, height/2);//mouseX, mouseY
//eye
fill(231,255,188);
stroke(0);
ellipse(-100,-100,50,45);
fill(0);
ellipse(-100,-100,30,28);
//head
noFill();
strokeWeight(2);
stroke(157,88,255);
curve(-400,-100,-200,-200,50,-150,150,50);
curve(-100,-400,-200,-200,-150,50,0,100);
curve(-300,50,-150,50,50,-150,50,-300);
//body
curve(-200,-350,50,-150,250,250,600,300);
curve(-200,-200,-150,50,250,250,500,250);
}
You could use the curveVertex() function.
This doesn't do exactly what you want, but you can play around with it until it does:
//body
fill(255, 0, 0);
beginShape();
curveVertex(-200, -350);
curveVertex(50, -150);
curveVertex(250, 250);
curveVertex(-150, 50);
curveVertex(-200, -200);
endShape();
Note that you can have multiple blocks like this to fill in different pieces with the same color.

Resources