第1关:立方体消隐
一. 任务描述
1. 本关任务
(1) 理解深度缓冲器算法(Z-Buffer)算法; (2) 将triangle函数和main函数中的空白部分补充完整。
2. 输入
(1) 代码将自动输入一个边长为1的obj正方体模型,具体模型如下图:
(2) 代码会自动对将立方体进行模型变换、观察变换和投影变换; (3) 若代码填写正确,程序会对由立方体顶点生成的三角形面片triangleVertex1和triangleVertex2消隐,对应生成不同颜色的立方体面。其中代码中已给出颜色,在const PNGColor clr[6]中保存。
3. 输出
具体结果如下图所示:
二. 相关知识
1. 深度缓冲器(Z-Buffer)算法
如果我们先绘制一个距离较近的物体,在绘制距离较远的物体,则距离较远的位图因为后绘制,会把距离近的物体覆盖掉,如下面图片中先绘制红色再绘制黄色,那么红色图片就被覆盖掉了。有了深度缓冲区后,在绘制的时候只需要判断像素点的Z值(深度值),深度值大的(距离远)被覆盖,那么绘制物体的顺序就不那么重要了。实际上,只要存在深度缓冲区,都会把像素的深度值写入到缓冲区中。 如图,假定xoy面为投影面,z轴为观察方向,过屏幕上任意像素点(x,y)作平行于z轴的射线R,与物体表面相交于p1和p2点,p1和p2点的z值称为该点的深度值。
z-buffer算法比较p1和p 2的z值, 将最大的z值存入z缓冲器中显然,p1在p 前面,屏幕上(x,y)这一点将显示p1点的颜色 算法思想:先将Z缓冲器中各单元的初始值置为最小值。当要改变某个像素的颜色值时,首先检查当前多边形的深度值是否大于该像素原来的深度值(保存在该像素所对应的Z缓冲器的单元中)如果大于原来的z值,说明当前多边形更靠近观察点,用它的颜色替换像素原来的颜色。
2. P点z值计算
对于P点的z值,可以通过重心坐标来计算:我们把P点z值也可以看成三角形顶A,B,C的重心坐标的一个线性组合,即: P.z = A.z*a + B.z*b + C.z*c, 其中A,B,C为三角形顶点, a,b,c为重心坐标。 其实不仅仅是P点的z,对于P点的任意性质,只要是我们觉得可以用线性组合来看的,我们都可以用这个重心坐标来计算。
三. 操作说明
(1) 按要求补全代码; (2) 点击窗口右下角"测评"按钮,等待测评结果,如果通过后可进行下一关任务。
开始你的任务吧,祝你成功!
四.实验代码
#include <vector>
#include <cmath>
#include <algorithm>
#include <iostream>
#include "model.h"
#include "geometry.h"
#include "pngimage.h"
using namespace std;
const double PI = acos(-1.0);
void line(Vec3i p0, Vec3i p1, PNGImage &image, PNGColor color)
{
bool steep = false;
if (std::abs(p0.x - p1.x) < std::abs(p0.y - p1.y))
{
std::swap(p0.x, p0.y);
std::swap(p1.x, p1.y);
steep = true;
}
if (p0.x > p1.x)
{
std::swap(p0.x, p1.x);
std::swap(p0.y, p1.y);
}
int dx = p1.x - p0.x;
int dy = std::abs(p1.y - p0.y);
int y = p0.y;
int d = -dx;
for (int x = p0.x; x <= p1.x; x++)
{
if (steep)
image.set(y, x, color);
else
image.set(x, y, color);
d = d + 2 * dy;
if (d > 0)
{
y += (p1.y > p0.y ? 1 : -1);
d = d - 2 * dx;
}
}
}
Vec3f barycentric(Vec3f *pts, Vec3f P)
{ //返回值是Vec3f(-1, 1, 1),如果z 分量不等于1则说明P点不在三角形内。
//返回值是Vec3f(1.f - (u.x + u.y) / u.z, u.y / u.z, u.x / u.z),P点在pts三角形区域内。
Vec3f u = Vec3f(pts[2].x - pts[0].x, pts[1].x - pts[0].x, pts[0].x - P.x) ^
Vec3f(pts[2].y - pts[0].y, pts[1].y - pts[0].y, pts[0].y - P.y);
/* `pts` and `P` has integer value as coordinates
so `abs(u[2])` < 1 means `u[2]` is 0, that means
triangle is degenerate, in this case return something with negative coordinates */
if (std::abs(u.z) < 1)
return Vec3f(-1, 1, 1);
return Vec3f(1.f - (u.x + u.y) / u.z, u.y / u.z, u.x / u.z);
}
void triangle(Vec3f *pts, float *zbuffer, PNGImage &image, PNGColor color)
{//对每一个pts代表的三角形区域进行计算,更新zbuffer的值。如果zbuffer的值更新了,就得用color值对该点作色
int minX = min({ pts[0].x, pts[1].x, pts[2].x });
int maxX = max({ pts[0].x, pts[1].x, pts[2].x });
int minY = min({ pts[0].y, pts[1].y, pts[2].y });
int maxY = max({ pts[0].y, pts[1].y, pts[2].y });
int width = image.get_width();
int height = image.get_height();
if (maxX >= width)
maxX = width - 1;
if (maxY >= height)
maxY = height - 1;
//P代表三角形区域的“包围盒区域”内的所有点,是以minX、maxX、minY、maxY控制的“长方形区域”内的所有点。该区域可以作色为三角形区域pts的颜色,也可以不变。不变是因为无深度值更新,即可能是背景色,也可能是其它三角形区域比当前三角形区域深度值大保持以前三角形区域的颜色。
Vec3f P;
for (P.x = minX; P.x <= maxX; P.x++) {
for (P.y = minY; P.y <= maxY; P.y++) {
Vec3f bc_screen = barycentric(pts, P);
//bs_screen表示pts三角形区域重心坐标。
if (bc_screen.x < 0 || bc_screen.y < 0 || bc_screen.z < 0) continue;
P.z = 0;
for (int i = 0; i < 3; i++)
// 请补充代码,计算P点的深度坐标z
/********** Begin ********/
P.z += pts[i].z * bc_screen[i];//P.z = A.z*a + B.z*b + C.z*c,
/********** End **********/
if (zbuffer[int(P.x + P.y*width)] < P.z) {
/********** Begin ********/
zbuffer[int(P.x + P.y*width)] = P.z;
image.set(P.x, P.y, color);
/********** End **********/
}
}
}
}
Matrix projection(Vec3f eye, Vec3f center)
{
Matrix m = Matrix::identity(4);
m[3][2] = -1.f / (eye - center).norm();
return m;
}
Matrix viewport(int x, int y, int w, int h, int depth) {
Matrix m = Matrix::identity(4);
m[0][3] = x + w / 2.f;
m[1][3] = y + h / 2.f;
m[2][3] = depth / 2.f;
m[0][0] = w / 2.f;
m[1][1] = h / 2.f;
m[2][2] = depth / 2.f;
return m;
}
Matrix lookat(Vec3f eye, Vec3f center, Vec3f up) {
Vec3f z = (eye - center).normalize();
Vec3f x = (up^z).normalize();
Vec3f y = (z^x).normalize();
Matrix res = Matrix::identity(4);
for (int i = 0; i < 3; i++) {
res[0][i] = x[i];
res[1][i] = y[i];
res[2][i] = z[i];
res[i][3] = -center[i];
}
return res;
}
Matrix translation(Vec3f v) {
Matrix Tr = Matrix::identity(4);
Tr[0][3] = v.x;
Tr[1][3] = v.y;
Tr[2][3] = v.z;
return Tr;
}
Matrix scale(float factorX, float factorY, float factorZ)
{
Matrix Z = Matrix::identity(4);
Z[0][0] = factorX;
Z[1][1] = factorY;
Z[2][2] = factorZ;
return Z;
}
Matrix rotation_x(float angle)
{
angle = angle * PI / 180;
float sinangle = sin(angle);
float cosangle = cos(angle);
Matrix R = Matrix::identity(4);
R[1][1] = R[2][2] = cosangle;
R[1][2] = -sinangle;
R[2][1] = sinangle;
return R;
}
Matrix rotation_y(float angle)
{
angle = angle * PI / 180;
float sinangle = sin(angle);
float cosangle = cos(angle);
Matrix R = Matrix::identity(4);
R[0][0] = R[2][2] = cosangle;
R[0][2] = sinangle;
R[2][0] = -sinangle;
return R;
}
Matrix rotation_z(float angle) {
angle = angle * PI / 180;
float sinangle = sin(angle);
float cosangle = cos(angle);
Matrix R = Matrix::identity(4);
R[0][0] = R[1][1] = cosangle;
R[0][1] = -sinangle;
R[1][0] = sinangle;
return R;
}
int main(int argc, char** argv)
{
const PNGColor white = PNGColor(255, 255, 255, 255);
const PNGColor black = PNGColor(0, 0, 0, 255);
const PNGColor red = PNGColor(255, 0, 0, 255);
const PNGColor green = PNGColor(0, 255, 0, 255);
const PNGColor blue = PNGColor(0, 0, 255, 255);
const PNGColor yellow = PNGColor(255, 255, 0, 255);
const PNGColor orange = PNGColor(255, 128, 0, 255);
const PNGColor clr[6] = {green, yellow, blue, red, white, orange};
Model *model = NULL;
const int width = 800;
const int height = 800;
const int depth = 255;
//generate some image
PNGImage image(width, height, PNGImage::RGBA); //Error when RGB because lodepng_get_raw_size_lct(w, h, colortype, bitdepth) > in.size() in encode
image.init(black);
model = new Model("cube.obj");
float *zbuffer = new float[width*height];
for (int i = 0; i < width * height; i++)
zbuffer[i] = -numeric_limits<float>::max();
Vec3f eye(0, 1.2, 4),center(0, 0, 0), up(0, 1, 0);
Matrix ModelView = lookat(eye, center, up) * rotation_y(45) * scale(0.4, 0.4, 0.4);
Matrix Projection = projection(eye, center);
Matrix ViewPort = viewport(width / 4, width / 4, width / 2, height / 2, depth);
for (int i = 0; i < model->nfaces(); i++)
{//对模型的每个面进行计算
vector<int> face = model->face(i);
if ((int)face.size() == 4)
{//模型的每个面都是4个点构成,就进行下面的计算
Vec3f triangleVertex1[3], triangleVertex2[3];
for (int j = 0; j < 3; j++)
{//每个四边形“分割”成2个三角形区域triangleVertex1和triangleVertex2
//v1是triangleVertex1上的3个点之一,循环控制
//v2是triangleVertex2上的3个点之一,循环控制
Vec3f v1 = model->vert(face[j]);
Vec3f v2 = model->vert(face[(j + 2) % 4]);
triangleVertex1[j] = ViewPort * Projection * ModelView * v1;
// 请补充代码,完成triangleVertex2[j]的计算
/********** Begin ********/
triangleVertex2[j] = ViewPort * Projection * ModelView * v2;
/********** End **********/
}
// 请将triangle函数补充完整
/********** Begin ********/
triangle(triangleVertex1,zbuffer , image,clr[i]);
triangle(triangleVertex2, zbuffer, image,clr[i]);
/********** End **********/
}
}
image.flip_vertically(); // i want to have the origin at the left bottom corner of the image
image.write_png_file("../img_step3/test.png");
delete model;
delete zbuffer;
return 0;
}