There is a set of vertices:
new Vector(-0.5,-0.5,-0.5),
new Vector(-0.5, 0.5,-0.5),
new Vector( 0.5, 0.5,-0.5),
new Vector( 0.5,-0.5,-0.5),
new Vector(-0.5,-0.5, 0.5),
new Vector(-0.5, 0.5, 0.5),
new Vector( 0.5, 0.5, 0.5),
new Vector( 0.5,-0.5, 0.5)
and a set of triangles:
new Triangle(0,2,1,[0,0,255,255],[255,255,255,255],[0,255,255,255]),
new Triangle(0,3,2,[255,0,255,255],[0,0,255,255],[255,255,255,255]),
new Triangle(6,5,1,[0,255,255,255],[255,255,0,255],[0,255,0,255]),
new Triangle(1,2,6,[255,255,255,255],[255,255,0,255],[0,255,255,255]),
new Triangle(2,6,3,[255,0,255,255],[255,255,255,255],[255,255,0,255]),
new Triangle(6,3,7,[255,0,255,255],[255,0,0,255],[255,255,0,255]),
new Triangle(5,1,0,[0,0,255,255],[0,255,255,255],[0,255,0,255]),
new Triangle(5,0,4,[0,0,255,255],[0,0,0,255],[0,255,0,255]),
new Triangle(0,7,4,[0,0,255,255],[255,0,0,255],[0,0,0,255]),
new Triangle(0,3,7,[255,0,255,255],[0,0,255,255],[255,0,0,255]),
new Triangle(6,5,7,[255,0,0,255],[255,255,0,255],[0,255,0,255]),
new Triangle(7,5,4,[255,0,0,255],[0,0,0,255],[0,255,0,255])
After the projection transformation, to interpolate the attributes (in this case, the colors in the vertices), I need to sort the value at each vertex of the polygon in ascending order.
class Triangle {
constructor(vA, vB, vC, cA = [255,0,0,255], cB = cA, cC = cA) {
this.vA = vA;
this.vB = vB;
this.vC = vC;
this.cA = cA;
this.cB = cB;
this.cC = cC;
}
static normal(vA, vB, vC) {
var ab = Vector.subtract(vB, vA);
var ac = Vector.subtract(vC, vA);
return Vector.cross(ab, ac);
}
sort(projected) {
let vA = this.vA;
let vB = this.vB;
let vC = this.vC;
let cA = this.cA;
let cB = this.cB;
let cC = this.cC;
if (projected[vB].y < projected[vA].y) {
[vA, vB] = [vB, vA];
[cA, cB] = [cB, cA];
}
if (projected[vC].y < projected[vA].y) {
[vA, vC] = [vC, vA];
[cA, cC] = [cC, cA];
}
if (projected[vC].y < projected[vB].y) {
[vB, vC] = [vC, vB];
[cB, cC] = [cC, cB];
}
return new Triangle(vA,vB,vC,cA,cB,cC)
}
}
Why are the vertices getting out of place? I tried to sort differently, but when animating the camera movement, this artifact still occurs. If someone has encountered it, can you tell me what could be the problem?