基础知识08多个三角形组合起来(简单房子)[转]

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


这是一个由14个三角形组成的一个房子

我们先要理解，这个房子是由 3DMAX 及其它软件制作出来的 3D模型，那我们应该怎么去在FLASH里展示出来

大家在用其它flash 3D引擎时，常会使用 .dae文件 。 因为dae是通度3D模型数据  他的结构 就是由 v, u, uv 组成

（如果细心的同志，会发现dae文件是个 XML 数据，简单的来说有三组数据来组成，当然可能会有什么灯光之类的

在这里我只争对最简单的模型来应用）

一、数据拆分方法，

①.同样那我们在这个FLASH程序里也要用到这三个参数， 数据都是字符串的形形式排列出着的，

private  var _stringV:String = “-11765.4 -4473.12 0.000033 11765.4 -4473.12 0.000033 -11765.4 4473.12 -0.000033 11765.4 4473.12 -0.000033 11765.4 0.0001 17448.4 -11765.4 0.0001 17448.4 11765.4 -7863.28 6070.26 -11765.4 -7863.28 6070.26 11765.4 7863.28 6070.26 -11765.4 7863.28 6070.26″;
private  var _stringU:String = “0.667021 0.012993 -0.225191 0.996577 0.012993 -0.22519 0.667468 0.010391 0.5 0.997024 0.010391 0.5 0.996577 0.993478 0.137405 0.667021 0.993478 0.137405 0.996577 0.354103 -0.5 0.667021 0.354103 -0.5 0.258144 0.016835 -0.5 0.258144 0.016834 0.5 0.074669 0.016835 -0.5 0.331531 0.014076 0.068861 0.664663 0.014076 0.068861 0.664663 0.992088 -0.5 0.331531 0.992088 -0.5 0.074669 0.016834 0.5 0.166407 0.990086 0.5 0.166407 0.990086 -0.5 0.664663 0.354325 0.5 0.327671 0.355428 0.5 0.331531 0.354325 0.5 0.327671 0.355428 -0.5 0.005142 0.355428 0.5 0.005142 0.355428 -0.5″;
private  var _stringUV:String = “1 1 6 6 7 7 7 7 0 0 1 1 3 15 8 22 6 19 6 19 1 9 3 15 2 11 9 20 8 18 8 18 3 12 2 11 0 8 7 21 9 23 9 23 2 10 0 8 4 4 5 5 7 7 7 7 6 6 4 4 8 22 4 16 6 19 5 14 4 13 8 18 8 18 9 20 5 14 7 21 5 17 9 23″;

②.接下来我们要将这些字符串的数据存到下面的数组中来，方便读取第几个

private var _v_array:Array=new Array()
private var _u_array:Array=new Array()
private var _uv_array:Array=new Array()

③.接下来我们要做的是怎么拆这些数据 怎么存到数据中去

var temp_array:Array = new Array();  //临时用到而以
var scale_D:Number = 0.006  //这个比例值，就是对上面数据进行缩放的，

④.拆3维中的点坐标

temp_array = (_stringV.split(” “))   //先将 字符串以 ” ” (空格存到数组中去)
for (i = 0; i < temp_array.length / 3; i++ ) {      //三个一组
_v_array.push(new Vector3D(temp_array[i * 3 + 0] * scale_D, temp_array[i * 3 + 2] * scale_D, temp_array[i * 3 + 1] * scale_D))
}

注意一下， 我们三个组成一个 Vector3D （他是一个3维的点，包含x,y,z）对象， 因为我们的dae文件的3维坐标是 x,z,y

在这里我们就将 第2，个和第3个换一下位置就可以了，

⑤.拆贴图的点和UV的方法，也是跟上面一个道理

temp_array = (_stringU.split(” “))  //拆分 2D 贴图
for (i = 0; i < temp_array.length / 3; i++ ) {
_u_array.push(new Array(temp_array[i * 3 + 0], temp_array[i * 3 + 1],temp_array[i * 3 + 2]));
}

temp_array = (_stringUV.split(” “))   //折分UV 对应坐标
for (i = 0; i < temp_array.length/2 ; i++ ) {
_uv_array.push(new Array(temp_array[i*2+0],temp_array[i*2+1]))

}

⑥. 这部份在上一章节中有说明过

//在这里我们将3D的点转存到 _vitem 中，是为了方便转换相对镜头坐标而用  数量是一至的

for (var i = 0; i < _v_array.length ;i++ ) {
var _obj:Object = new Object
_obj.x = _v_array[i].x
_obj.y = _v_array[i].y
_obj.z = _v_array[i].z
_obj.bx = 0;
_obj.by = 0;
_obj.bz = 0;
_vitem.push(_obj);
}

⑦.初始化_triangles贴图坐标，用点坐标

for (i = 0; i < _uv_array.length; i++ ) {   //是_triangles进行 uvtData（贴图） 赋值 ， 同时要给对应的vertices 进行赋值（暂为0,0）以后会运算的
_triangles.vertices.push(0,0);
_triangles.uvtData.push(_u_array[_uv_array[i][1]][0],1-_u_array[_uv_array[i][1]][1],1);
}

二、渲染内容   _up_data()

_Cam.angle_y++   //镜头角度变化
_catch_cam(_Cam) //找到镜头坐标 之前有改过

for (var i in _vitem) {
math_change_point(_vitem[i])    //对所有点 转换成相对于镜头的坐标
}

//接下来就是特别注意的,从UV数数中找出对应该的 3D点的坐标

for (var j = 0; j < _uv_array.length ; j++ ) {
var v_id = (_uv_array[j ][0])   //找到坐标 后然对_triangles.vertices的新坐标进行赋新值
_triangles.vertices[j * 2 + 0] = _vitem[v_id ].bx / (_vitem[v_id].bz + _Cam.br) * _Cam.br;
_triangles.vertices[j * 2 + 1] = -_vitem[v_id ].by / (_vitem[v_id].bz + _Cam.br) * _Cam.br;
}

附：在这里我们并没有进行相对于X轴旋转，贴图深度变化的修改，后面的章节将会逐一介绍