透视投影的背面去除答案

【问题标题】：Backface removal for Perspective Projection透视投影的背面去除
【发布时间】：2016-02-09 06:14:58
【问题描述】：

我正在进行 3D 练习，并且我已经实施了仅适用于正交投影的背面去除技术，并且需要对其进行更改以支持其他投影。

到目前为止我所做的是：

对于每个多边形，我循环所有顶点
执行转换和投影计算
用纽维尔法计算表面法线
仅当矢量方向为时才绘制多边形

正如我所说，这仅适用于正交投影，而我正在与其他投影作斗争。请任何帮助都会很棒

顺便说一句，我在这里某处看到了这个解释，但不明白： “..在实际 3D 硬件中使用的通常方法是首先进行所有转换（包括投影），然后检查生成的 2D 三角形是逆时针还是顺时针缠绕，并根据该条件保留或丢弃”。也许有人可以解释生成的二维三角形是什么？

我正在使用 html5 画布和 js。

【问题讨论】：

标签： canvas 3d

【解决方案1】：

3d 硬件中的这种方法调用graphic pipeline。不管你使用哪种类型的投影，它总是会被转换成二维三角形，然后进行背面剔除测试。

function Triangle (a, b, c) {
    this.pointA = a;
    this.pointB = b;
    this.pointC = c;
}

Triangle.prototype.isBackface = function () {
    var ax = this.pointA.getProjectedX() - this.pointB.getProjectedX();
    var ay = this.pointA.getProjectedY() - this.pointB.getProjectedY();
    var bx = this.pointA.getProjectedX() - this.pointC.getProjectedX();
    var by = this.pointA.getProjectedY() - this.pointC.getProjectedY();
    var cz = ax * by - ay * bx;
    return cz < 0;
};

// before drawing a triangle you call a isBackface method. This method check
// either this triangle is counterclockwise or clockwise but just after 
// all projections.
Triangle.prototype.draw = function (context) {
    if (this.isBackface()) {
        return;
    }
    this._draw();
};

【讨论】：