3D 引擎在旋转时拉伸物体

Question

我制作了一个小型 3D 引擎。

但我对旋转功能有一些问题。它们时不时地使物体伸展。这是数学：

this.rotateX = function(angle) {
    var cos = Math.cos(angle);
    var sin = Math.sin(angle);

    for(var i = 0; i < this.points.length; i++) {
        this.points[i].y = sin * this.points[i].z + cos * this.points[i].y;
        this.points[i].z = -sin * this.points[i].y + cos * this.points[i].z;
    }
}

this.rotateY = function(angle) {
    var cos = Math.cos(angle);
    var sin = Math.sin(angle);

    for(var i = 0; i < this.points.length; i++) {
        this.points[i].x = cos * this.points[i].x - sin * this.points[i].z;
        this.points[i].z = sin * this.points[i].x + cos * this.points[i].z;
    }
}

this.rotateZ = function(angle) {
    var cos = Math.cos(angle);
    var sin = Math.sin(angle);

    for(var i = 0; i < this.points.length; i++) {
        this.points[i].x = cos * this.points[i].x + sin * this.points[i].y;
        this.points[i].y = -sin * this.points[i].x + cos * this.points[i].y;
    }
}

Answer 1

this.points[i].y = sin * this.points[i].z + cos * this.points[i].y;
this.points[i].z = -sin * this.points[i].y + cos * this.points[i].z;

你正在计算 y 并使用这个新的 y 计算 z. 。你可能应该使用旧的 y （旋转前）：

var y = sin * this.points[i].z + cos * this.points[i].y;
var z = -sin * this.points[i].y + cos * this.points[i].z;
this.points[i].y = y;
this.points[i].z = z;