THREE.Geometry ()로 vertices를 업데이트 할 때 verticesNeedUpdate를 사용하는 방법을 모르겠습니다.

하고 싶었던 일


THREE.Geometry() 로 형상 데이터를 작성할 때, 랜덤하게 3D 공간상에 점을 두어 가는 구현을 하고 있었다. 이 랜덤에 놓은 점을 움직여 파티클의 표현을 하고 싶었다

샘플 (움직이는 것)



문제점



샘플 코드와 같이, 작성한 geometryvertex 안에 있는 y축의 어느 편의 위치에 흩어져 있는지의 값을 변경해도, 왜 상관없다.
mesh.geometry.vertices.forEach(vertex => {
      vertex.setY(vertex.y + vertex.velocity.y);
});

해결 방법



참고문헌 에 따르면, "geometry.verticesNeedUpdate"는 렌더링 후에 매번 false가 될 것 같습니다.mesh.geometry.verticesNeedUpdate = true; 를 매번 렌더링에서 호출하는 함수 안에 설치함으로써 해결
// レンダリング---------------------
  function render(){
    requestAnimationFrame(render);
    //particle system自体をまわす
    mesh.rotation.y += 0.001;

    // meshに設定したgeometryの中に入っている点のy軸をランダムに動かすようにする
    mesh.geometry.vertices.forEach(vertex => {
      vertex.setY(vertex.y + vertex.velocity.y);
    });
    // geometryの「geometry.verticesNeedUpdate」はレンダリング後に毎回falseになるらしいのでtrueをここで設定している。
    // https://stackoverflow.com/questions/24531109/three-js-vertices-does-not-update
    mesh.geometry.verticesNeedUpdate = true;

    // マウスでカメラを操作するため
    controls.update();

    //シーンとカメラをいれる。
    renderer.render(scene,camera);
  }

그건 그렇고



문서가 vertices를 업데이트하는 경우 verticesNeedUpdate 있다는 것을 알고 계시다면 알려주세요.


샘플 코드



참고문헌

좋은 웹페이지 즐겨찾기