访问BufferGeometry中的面

Gab*_*iel 6 three.js

geometry.faces只能用于新的THREE.BoxGeometry.然后我尝试使用THREE.BoxBufferGeometry我不能改变面部的颜色.

不工作:

  var geometry = new THREE.BoxBufferGeometry( 100, 100, 100 );
  for ( var i = 0; i < geometry.faces.length; i ++ ) {
    geometry.faces[ i ].color.setHex( Math.random() * 0xffffff );
  }
Run Code Online (Sandbox Code Playgroud)

工作:

  var geometry = new THREE.BoxGeometry( 100, 100, 100 );
  for ( var i = 0; i < geometry.faces.length; i ++ ) {
    geometry.faces[ i ].color.setHex( Math.random() * 0xffffff );
  }
Run Code Online (Sandbox Code Playgroud)

Mar*_*fuß 16

three.js中的BufferGeometries与常规Geometries根本不同.它们不是面向易于操作,而是面向网格需要如何传递到WebGL API.

话虽如此,BufferGeometries没有明确的"面孔"概念,它们是隐含的.BufferGeometry由许多属性组成(有关背景,请参见此处),其中一个属性是position-attribute.

在常规的BufferGeometry中(与"indexed"相反),面被存储为该属性中的三个顶点的序列(类似于[x1, y1, z1, x2, y2, z2, x3, ...],因此对于第一个面position[0]是第一个顶点的x分量并且position[8]是z分量第三个顶点).所有其他属性使用类似的索引方案.如果color为几何定义属性,则可以通过在所有三个面顶点的位置处写入相同的颜色值来控制面颜色.

索引几何是不同的:不是重复所有三角形的顶点,而是每个顶点只存储一次.附加属性index用于将顶点连接成三角形.每个具有索引几何的面顶点都不可能有颜色,因为顶点在任何地方都必须具有相同的颜色.但是,您可以使用[0, 1, 2, 0, 2, 3, ...]将索引几何转换为常规几何.