球体的顶点与索引创建方法----以WebGL为例
2022/7/9 23:23:39
本文主要是介绍球体的顶点与索引创建方法----以WebGL为例,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
上图,左图为一个球体的三维图,其中一个圆面以θ角(范围为[0,PI])的方式确定,该圆面在x-z坐标平面投影如右图,其中圆面上任意一点又由α确定(范围为[0,2PI])。
假定该球体半径为r,那么球面任意一点均可以用r,θ,α唯一确定,确定关系如下:
x=rsinθcosα;y=rcosθ;z=rsinθsinα
。
那么,可以将θ,α,均分为S+1份(也可以分别是不同的份数),然后可以得到(S+1)×(S+1)个点的坐标。
var SPHERE_DIV = 13; var i, ai, si, ci; var j, aj, sj, cj; var p1, p2; var positions = []; var indices = []; // Generate coordinates for (j = 0; j <= SPHERE_DIV; j++) { aj = j * Math.PI / SPHERE_DIV; sj = Math.sin(aj); cj = Math.cos(aj); for (i = 0; i <= SPHERE_DIV; i++) { ai = i * 2 * Math.PI / SPHERE_DIV; si = Math.sin(ai); ci = Math.cos(ai); positions.push(si * sj); // X positions.push(cj); // Y positions.push(ci * sj); // Z } }
右边是从左边网格抽象出来的单个网格单元,记左上角P1的位置为(i,j),那么P1的值为jX(S+1)+i,而P2的值为P1+(S+1),注意该单个网格由于在(i,j)的位置,都可以确定P2以及P1+1,P2+1,剩余三个点,而这三个点都是i,j的下一轮,所以在取得索引值时候,上界均为S-1,而非S,绘制时候,选择gl.TRIANGLE,所以每次取到的索引号是(p1,p2,p1+1,p1+1,p2,p2+1)。
for (j = 0; j < SPHERE_DIV; j++) { for (i = 0; i < SPHERE_DIV; i++) { p1 = j * (SPHERE_DIV+1) + i; p2 = p1 + (SPHERE_DIV+1); indices.push(p1); indices.push(p2); indices.push(p1 + 1); indices.push(p1 + 1); indices.push(p2); indices.push(p2 + 1); }
这篇关于球体的顶点与索引创建方法----以WebGL为例的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-05-19永别了,微服务架构!
- 2024-05-15鸿蒙生态设备数量超8亿台
- 2024-05-13TiDB + ES:转转业财系统亿级数据存储优化实践
- 2024-05-09“2024鸿蒙零基础快速实战-仿抖音App开发(ArkTS版)”实战课程已上线
- 2024-05-09聊聊如何通过arthas-tunnel-server来远程管理所有需要arthas监控的应用
- 2024-05-09log4j2这么配就对了
- 2024-05-09nginx修改Content-Type
- 2024-05-09Redis多数据源,看这篇就够了
- 2024-05-09Google Chrome驱动程序 124.0.6367.62(正式版本)去哪下载?
- 2024-05-09有没有大佬知道这种数据应该怎么抓取呀?