Smoothing/Antialiasing in ProcessingJS

in Processing with Other Languages • 1 year ago

I am currently working with Processing 2.0a4 and I wonder if anybody else has the same problem:

When running the sketch below in standard mode everything is okay. But when i render it in javascript mode it doesn't smooth/antialias the lines. Am I doing something wrong or is there any other way to smooth/antialias in processingjs?

void setup() {
size(400, 400, OPENGL);
hint(DISABLE_OPENGL_2X_SMOOTH);
hint(ENABLE_OPENGL_4X_SMOOTH);
smooth();
stroke(0);
noFill();
strokeWeight(2);
}
void draw() {
background(255);
rotateX(mouseX/200.0);
rotateY(mouseY/200.0);
translate(width/2, height/2);
box(200);
}

Thanks in advance,

mrzl

Replies(4)

PhiLho

Re: Smoothing/Antialiasing in ProcessingJS

1 year ago

Unless Processing.js uses WebGL, I don't think it has a real OpenGL mode, so these hints are probably without effect.

marzzzel

Re: Smoothing/Antialiasing in ProcessingJS

1 year ago

Oh yeah, thats true. Since in processing 2.0 the P3D renderer has been replaced by OPENGL its not possible to smooth at all?

therealpo..

Re: Smoothing/Antialiasing in ProcessingJS

1 year ago

Processing.js uses WebGL, but we have a line in processing.js that turns off aliassing, because it broke on Firefox a while ago. You can edit processing.js and make it work by finding the Drawing3D.prototype.size function and removing the context options argument (the {...} bit) there:

gl = canvas.getContext(ctxNames[i], {antialias: false});

should become

gl = canvas.getContext(ctxNames[i]);

We'll be removing this in a future release now that firefox no longer dies on code it shouldn't have died on in the first place =)

marzzzel

Re: Smoothing/Antialiasing in ProcessingJS

1 year ago

Great, that worked. Thanks a lot!

Top Reply

Response title

Attachments

New to this Portal?