簡述BufferGeometry

作者：桑榆
QQ：934440653
有問題，評論留言，或qq聯繫

還未完成，待續…

1、BufferGeometry與Geometry的區別

BufferGeometry和Geometry可以實現同樣的功能，在功能上並沒有很大的區別；主要的區別在對象的數據結構不同。
BufferGeometry高效的祕訣：獎數據放在一個連續的內存空間中，和geometry一樣，它存儲了頂點，面索引，法線，顏色，紋理座標和自定義的一些數據。連續的存儲空間能夠節省傳遞數據到CPU的時間。

通過以下代碼進行比較：

var geometry = new THREE.BoxGeometry(10, 8, 9);
console.log('幾何體數據結構',geometry);
console.log('頂點位置數據',geometry.vertices);
console.log('頂點紋理座標',geometry.faceVertexUvs);
console.log('幾何體三角形信息',geometry.faces);

var geometry = new THREE.BoxBufferGeometry(7, 6, 8);
console.log('幾何體數據結構',geometry);
console.log('頂點位置、法向量、UV、顏色頂點等數據集合',geometry.attributes);
console.log('頂點位置數據',geometry.attributes.position);
console.log('頂點索引數據',geometry.index);

創建一個BufferGeometry對象

在vertices 這個數組中有18條數據，每3個爲一組數據（即一個頂點），共計6組頂點數據。
注：在threejs中不論是二維數組，或者一維數組，最終都會轉化爲一個數組。

var geometry = new THREE.BufferGeometry();
var vertices = new Float32Array( [
	-1.0, -1.0,  1.0,
	 1.0, -1.0,  1.0,
	 1.0,  1.0,  1.0,

	 1.0,  1.0,  1.0,
	-1.0,  1.0,  1.0,
	-1.0, -1.0,  1.0
] );
geometry.addAttribute( 'position', new THREE.BufferAttribute( vertices, 3 ) ); //查看下方，方法文檔
var material = new THREE.MeshBasicMaterial( { color: 0xff0000 } );
var mesh = new THREE.Mesh( geometry, material );

方法

1、addAttribute ( name : String, attribute : BufferAttribute ) 給Geometry添加屬性

name ：給Geometry添加的屬性名；attribute：該屬性的參數
BufferAttribute與BufferGeometry聯合使用BufferAttribute(array,itemSize)。array數組，itemSize表示數組中的幾個數爲一組（頂點或其它）。