I am using the following code to draw a cube.
// Re-creates the default perspective
size(100, 100, P3D);
noFill();
smooth();
float fov = PI/3.0;
fill(25, 210, 12);
float cameraZ = (height/2.0) / tan(fov/2.0);
perspective(fov, float(width)/float(height),
cameraZ/10.0, cameraZ*10.0);
translate(50, 50, 0);
rotateX(-PI/6);
rotateY(PI/3.5);
box(45);
The call to perspective method causes the cube to show up in dotted lines, how do I modify the code to get a solid line.
Are there any libraries on top of processing.js which provide a simple wra开发者_C百科pper to build these 3D shapes.
On a functional note, you'll want to format that code better:
void setup() {
// Re-creates the default perspective
size(100, 100, P3D);
noFill();
smooth();
// use this if your animation is input-based,
// so the browser doesn't hog the cpu.
noLoop();
}
void draw() {
float fov = PI/3.0;
fill(25, 210, 12);
float cameraZ = (height/2.0) / tan(fov/2.0);
perspective(fov, float(width)/float(height),
cameraZ/10.0, cameraZ*10.0);
translate(50, 50, 0);
rotateX(-PI/6);
rotateY(PI/3.5);
box(45);
}
But on a constructive note: this code works fine for me using processing.js 1.1.0 in Chrome 10 and Firefox 4. There are no dotted lines, just nice solid edges.
精彩评论