Some pixels of the drawn triangle are not within the triangle's vertices

Viewed 35

I made a quad, that rotates around the Y axis and at some parts of the rotation some of the pixels extend past the triangle's side and form a line. This is a picture of the lines I am talking about - http://0x0.st/oOYp.png. This might be a floating point error or a rounding problem in the code, but I am unsure if that can cause this many pixels. This seems to only happen with the top of the quad. This is the tutorial I followed for the triangle rasterization - http://www.sunshine2k.de/coding/java/TriangleRasterization/TriangleRasterization.html. This is the full code - https://pastebin.com/zhA8U6cp. This is the flat top triangle drawing loop (All of the variables are floats except i and framebuffer):

currentxleft = bottom[0];
currentxright = bottom[0];
slopeleft  = (bottom[0] - left[0])  / (bottom[1] - left[1]);
sloperight = (bottom[0] - right[0]) / (bottom[1] - right[1]);
for(i = bottom[1]; i > left[1]; i--){
   for(j = currentxleft; j <= currentxright; j++){
      fragmentshader(incolor, outcolor);
      framebuffer[i * width + j] = (255 << 24 | ((int)outcolor[0] * 255 & 0xFF) << 16 | ((int)outcolor[1] * 255 & 0xFF) << 8 | (int)outcolor[2] * 255 & 0xFF);
   }
   currentxleft -= slopeleft;
   currentxright -= sloperight;
}

And this is the bottom flat triangle drawing loop:

currentxleft = top[0];
currentxright = top[0];
slopeleft  = (left[0]  - top[0]) / (left[1]  - top[1]);
sloperight = (right[0] - top[0]) / (right[1] - top[1]);
for(i = top[1]; i < left[1]; i++){
   for(j = currentxleft; j <= currentxright; j++){
      fragmentshader(incolor, outcolor);
      framebuffer[i * width + j] = (255 << 24 | ((int)outcolor[0] * 255 & 0xFF) << 16 | ((int)outcolor[1] * 255 & 0xFF) << 8 | (int)outcolor[2] * 255 & 0xFF);
   }
   currentxleft += slopeleft;
   currentxright += sloperight;
}

This is the declaration and definition of the variables:

float top[2];
float left[2];
float right[2];
float currentxleft;
float currentxright;
float slopeleft;
float sloperight;

float bottom[2];
float left[2];
float right[2];
float currentxleft;
float currentxright;
float slopeleft;
float sloperight;

if(v1[1] < v2[1] && v1[1] < v3[1]){
   top[0] = v1[0];
   top[1] = v1[1];
   if(v2[0] < v3[0]){
      left[0] = v2[0];
      left[1] = v2[1];
      right[0] = v3[0];
      right[1] = v3[1];
   }else{
      left[0] = v3[0];
      left[1] = v3[1];
      right[0] = v2[0];
      right[1] = v2[1];
   }
}
if(v2[1] < v3[1] && v2[1] < v1[1]){
   top[0] = v2[0];
   top[1] = v2[1];
   if(v1[0] < v3[0]){
      left[0] = v1[0];
      left[1] = v1[1];
      right[0] = v3[0];
      right[1] = v3[1];
   }else{
      left[0] = v3[0];
      left[1] = v3[1];
      right[0] = v1[0];
      right[1] = v1[1];
   }
}
if(v3[1] < v1[1] && v3[1] < v2[1]){
   top[0] = v3[0];
   top[1] = v3[1];
   if(v1[0] < v2[0]){
      left[0] = v1[0];
      left[1] = v1[1];
      right[0] = v2[0];
      right[1] = v2[1];
   }else{
      left[0] = v2[0];
      left[1] = v2[1];
      right[0] = v1[0];
      right[1] = v1[1];
   }
}
0 Answers
Related