javascript Three.js - 什么是 PlaneBufferGeometry
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/27198525/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Three.js - What is PlaneBufferGeometry
提问by Milk3dfx
What is PlaneBufferGeometry exactly and how it is different from PlaneGeometry? (r69)
什么是 PlaneBufferGeometry，它与 PlaneGeometry 有何不同？(r69)
回答by Kevin Kuyl
PlaneBufferGeometryis a low memory alternative for PlaneGeometry. the object itself differs in a lot of ways. for instance, the vertices are located in PlaneBufferGeometry are located in PlaneBufferGeometry.attributes.positioninstead of PlaneGeometry.vertices
PlaneBufferGeometry是PlaneGeometry. 对象本身在很多方面都不同。例如，顶点位于 PlaneBufferGeometry 位于PlaneBufferGeometry.attributes.position而不是PlaneGeometry.vertices
you can take a quick look in the browser console to figure out more differences, but as far as i understand, since the vertices are usually spaced on a uniform distance (Xand Y) from each other, only the heights (Z) need to be given to position a vertex.
您可以在浏览器控制台中快速查看以找出更多差异，但据我所知，由于顶点通常以均匀的距离 ( Xand Y)间隔，因此只Z需要给出高度 ( )定位一个顶点。
回答by Elias Hasle
The main differences are between Geometryand BufferGeometry.
主要区别在于Geometry和BufferGeometry之间。
Geometry is a "user-friendly", object-oriented data structure, whereas BufferGeometry is a data structure that maps more directly to how the data is used in the shader program. BufferGeometry is faster and requires less memory, but Geometry is in some ways more flexible, and certain operations can be done with greater ease.
Geometry 是一种“用户友好”的面向对象的数据结构，而 BufferGeometry 是一种数据结构，它更直接地映射到数据在着色器程序中的使用方式。BufferGeometry 速度更快，需要的内存更少，但 Geometry 在某些方面更灵活，并且可以更轻松地完成某些操作。
I have very little experience with Geometry, as I have found that BufferGeometry does the job in most cases. It is useful to learn, and work with, the actual data structures that are used by the shaders.
我对几何的经验很少，因为我发现 BufferGeometry 在大多数情况下都能完成这项工作。学习和使用着色器使用的实际数据结构很有用。
In the case of a PlaneBufferGeometry, you can access the vertex positions like this:
在 PlaneBufferGeometry 的情况下，您可以像这样访问顶点位置：
let pos = geometry.getAttribute("position");
let pa = pos.array;
Then set z values like this:
然后像这样设置 z 值：
var hVerts = geometry.heightSegments + 1;
var wVerts = geometry.widthSegments + 1;
for (let j = 0; j < hVerts; j++) {
for (let i = 0; i < wVerts; i++) {
//+0 is x, +1 is y.
pa[3*(j*wVerts+i)+2] = Math.random();
}
}
pos.needsUpdate = true;
geometry.computeVertexNormals();
Randomness is just an example. You could also (another e.g.) plot a function of x,y, if you let x = pa[3*(j*wVerts+i)];and let y = pa[3*(j*wVerts+i)+1];in the inner loop. For a small performance benefit in the PlaneBufferGeometry case, let y = (0.5-j/(hVerts-1))*geometry.heightin the outer loop instead.
随机性只是一个例子。你也可以（另如）绘制的x，y的函数，如果你let x = pa[3*(j*wVerts+i)];和let y = pa[3*(j*wVerts+i)+1];在内环。为了在 PlaneBufferGeometry 情况下获得较小的性能优势，请改为let y = (0.5-j/(hVerts-1))*geometry.height在外循环中。
geometry.computeVertexNormals();is recommended if your material uses normals and you haven't calculated more accurate normals analytically. If you don't supply or compute normals, the material will use the default plane normals which all point straight out of the original plane.
geometry.computeVertexNormals();如果您的材料使用法线并且您没有通过分析计算更准确的法线，则建议使用。如果您不提供或计算法线，则材质将使用默认平面法线，这些法线均直接指向原始平面。
Note that the number of vertices along a dimension is one more than the number of segments along the same dimension.
请注意，沿维度的顶点数比沿同一维度的线段数多 1。
Note also that (counterintuitively) the y values are flipped with respect to the j indices: vertices.push( x, - y, 0 );(source)
还需要注意的是（违反直觉地）的y值被翻转相对于第j指数：vertices.push( x, - y, 0 );（源）
