基础知识04一个自动旋转的四边形[转]

转载 原文为 http://www.pan3d.me/tutorial 作者 Pan3d.Me




在这里，将实现这个四边形在慢慢的转。转一圈为360 ,现在我们设定的是绕着Y轴旋转的角度为 _r

用到以下第一个数组来存最初的4个点。第二组数据存绕Y轴旋转后的位置坐标

private var _pointitem:Array = new Array()
private var _newpointitem:Array=new Array()

因为我们在这里需要时时渲染效果，所以必须清楚掉上次的图片 , clear()

然后旋转角度 _r++  这样就能保证它在转动着。

因为我们在这里只绕着 Y轴旋转，所有的 y 坐标都不会变化，只有 x, z  ;在变化。

a=_r * Math.PI / 180    //在这里是角度转幅度。

rx = (Math.cos(a) * x + Math.sin(a) * z);
rz = (Math.sin(a) *x + Math.cos(a) *z);

在这里是一个很有用的一个公式，简单理解就是，以 (0 ,0)为圆点， 原来的坐标 (x,y) 旋转  a 幅度后得到新的坐标 (rx,rz)

接下来我们逐个的对每一个原始点绕着Y轴旋转后 _r 之后

for (var i in _pointitem) {
_newpointitem[i].x = (Math.cos(_r * Math.PI / 180) * _pointitem[i].x + Math.sin(_r * Math.PI / 180) * _pointitem[i].z);
_newpointitem[i].z = (Math.sin(_r * Math.PI / 180) * _pointitem[i].x + Math.cos(_r * Math.PI / 180) * _pointitem[i].z);
var _obj = transform3d_to_2d(_newpointitem[i])
_triangles.vertices[i * 2 + 0] = _obj.x;
_triangles.vertices[i * 2 + 1] = _obj.y;
}

我们将转后的点都存到 _newpointiem 这里来， 然后我们再将第个点的位置 映射到 镜头上来 (上一篇里面有讲的)