三角形、平面法线、顶点法线

在Direct3D中,三角形是构成实体的基本单位,因为一个三角形正好是一个平面,以三角形面为单位进行渲染效率最高。

一个三角形由三个点构成,习惯上把这些点称为顶点(Vertex)。三角形平面有正反面之分,由顶点的排序决定:顶点按顺时针排列的表面是正面,如图。

clip_image001

屏幕剪辑的捕获时间: 2007/6/22, 14:59

其中与三角形平面垂直、且指向正面的矢量称为该平面的法线(Normal)。

在Direct3D中,为提高渲染效率,缺省条件下只有正面可见,不过可以通过IDirect3DDevice9::SetRenderState来改变设置,其对应的渲染状态常数为D3DRS_CULLMODE,具体用法请参阅SDK文档。

顶点法线(Vertex Normal)是过顶点的一个矢量,用于在高洛德着色(Gouraud Shading)中的计算光照和纹理效果。在生成曲面时,通常令顶点法线和相邻平面的法线保持等角,如图1,这样进行渲染时,会在平面接缝处产生一种平滑过渡的效果。如果是多边形,则令顶点法线等于该点所属平面(三角形)的法线,如图2,以便在接缝处产生突出的边缘。

clip_image002

屏幕剪辑的捕获时间: 2007/6/22, 15:17

clip_image003

屏幕剪辑的捕获时间: 2007/6/22, 15:16

转载于:https://my.oschina.net/riseworlds/blog/696705

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在Three.js中,法线是指每个顶点的法向量,用于计算光照和阴影。默认情况下,每个顶点都有一个法线数据,就像每一个顶点都有一个位置数据。可以通过设置几何体的顶点法线属性来定义法线数据。例如,以下代码创建了一个矩形平面,每个顶点都有一个法线数据: ```javascript // 矩形平面,无索引,两个三角形,6个顶点 const normals = new Float32Array([ 0, 0, 1, //顶点1法线( 法向量 ) 0, 0, 1, //顶点2法线 0, 0, 1, //顶点3法线 0, 0, 1, //顶点4法线 0, 0, 1, //顶点5法线 0, 0, 1, //顶点6法线 ]); // 设置几何体的顶点法线属性 geometry.attributes.normal = new THREE.BufferAttribute(normals, 3); ``` 除了顶点法线属性,Three.js还提供了面法线属性,可以通过计算顶点法线的平均值来获得。在渲染时,Three.js会自动使用面法线来计算光照和阴影。 另外,如果需要在场景中绘制线条,可以使用THREE.Line对象。以下代码创建了一个由三个点组成的三角形,并使用THREE.LineBasicMaterial定义了线条的颜色: ```javascript const vertices = new Float32Array([ 0, 0, 0, 50, 0, 0, 0, 100, 0, ]); // 创建几何体对象 const geometry = new THREE.BufferGeometry(); geometry.setAttribute('position', new THREE.BufferAttribute(vertices, 3)); // 线材质对象 const material = new THREE.LineBasicMaterial({ color: 0x00ffff //线条颜色 }); // 创建线模型对象 const line = new THREE.Line(geometry, material); ```

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值