代码之家  ›  专栏  ›  技术社区  ›  Mandroid

类型错误:三。BufferAttribute:数组应该是类型化数组

  •  0
  • Mandroid  · 技术社区  · 1 年前

    我试图在threejs中创建一个点云,如下所示:

    const pcGeom = new THREE.BufferGeometry();
    const rows = 100;
    const columns = 3;
    const vertices = [...Array(rows)].map(() => [...Array(columns)].fill(0));
    for(let i = 0; i < rows; i++) {
      for (let j = 0; j < columns; j++) {
         vertices[i][j] = Math.random() * (2 - 0) + 0;
      }
    }
    pcGeom.setAttribute( 'position', new THREE.BufferAttribute( vertices, 3 ) ); // error at this line
    const material = new THREE.MeshBasicMaterial( { color: 0xff0000 } );
    const pointCloud = new THREE.Mesh( geometry, material );
    

    但这会产生错误(在上面注释的行):

    TypeError: THREE.BufferAttribute: array should be a Typed Array.
    

    “顶点”已初始化,所以我想它是键入的,不是吗?

    1 回复  |  直到 1 年前
        1
  •  1
  •   Hao Wu    1 年前

    documentation ,the array 参数必须是 TypedArray 。所以,如果你正在与 Vector3 顶点,您可以考虑使用 Float32Array .

    TypedArray必须是平坦的 itemSize 参数表示每个组件的大小( 矢量3 即3)。所以第一个顶点是 [vertices[0], vertices[1], vertices[2]] 第二个顶点是 [vertices[3], vertices[4], vertices[5]] 以此类推。这样的东西应该奏效:

    const pcGeom = new THREE.BufferGeometry();
    const rows = 100;
    const columns = 3;
    const vertices = new Float32Array(rows * columns);
    for(let i = 0; i < rows; i++) {
      for (let j = 0; j < columns; j++) {
         vertices[i * columns + j] = Math.random() * (2 - 0) + 0;
      }
    }
    pcGeom.setAttribute( 'position', new THREE.BufferAttribute( vertices, 3 ) );
    const material = new THREE.MeshBasicMaterial( { color: 0xff0000 } );
    const pointCloud = new THREE.Mesh( pcGeom, material );