Three.JS 입자 시스템 내에서 개별 입자 이동

Three.js에서 약간의 문제가 발생합니다. 현재 각 프레임이 렌더링 될 때 입자 시스템 내에서 입자를 이동하려고합니다. 오류는보고되지 않지만 아무 것도 움직이지 않습니다! http://aerotwist.com/tutorials/creating-particles-with-three-js/의 코드에서 취한 예제는 particle.position.y 구문을 사용하지만 아래 코드를 미러링 할 때 JS 콘솔에서 Cannot set property 'y' of undefined을 반환합니다. 내가 잘못 가고있는 곳의 도움이나 조언을 많이 주시면 감사하겠습니다.Three.JS 입자 시스템 내에서 개별 입자 이동

전체 소스 코드 : 당신이 당신의 particleSystem을 만든 후 particleSystem.sortParticles = true;을 추가해야처럼

 var scene, camera, renderer, particleCount = 0, particleSystem, particles; 

     init(); 
     animate(); 

     function init() 
     { 
      scene = new THREE.Scene(); 
      camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000); 
      scene.add(camera); 
      camera.position.z = 5; 

      renderer = new THREE.WebGLRenderer(); 
      renderer.setSize(window.innerWidth, window.innerHeight); 
      document.body.appendChild(renderer.domElement); 

      particleCount = 1800, 
      particles = new THREE.Geometry(); 
      var pMaterial = new THREE.ParticleBasicMaterial({color: 0xFFFFFF, size: 0.5}); 

      for (var i = 0; i < particleCount; i++) 
      { 
       var pX = Math.random() * 500 - 250, 
        pY = Math.random() * 500 - 250, 
        pZ = Math.random() * 500 - 250, 
        particle = new THREE.Vector3(pX, pY, pZ); 

       particles.vertices.push(particle); 
      } 

      particleSystem = new THREE.ParticleSystem(particles, pMaterial); 
      scene.add(particleSystem); 
     } 

     function animate() 
     { 
      requestAnimationFrame(animate); 
      renderer.render(scene, camera); 

      var pCount = particleCount; 
      while (pCount--) 
      { 
       var particle = particles.vertices[pCount]; 
       particle.y = Math.random() * 500 - 250; 
       particleSystem.geometry.vertices.needsUpdate = true; 
      } 

     }

출처

2014-04-18 user3549051

질문에 'particle.position.y'라고 언급되어 있지만 코드에'particle.y'라고 쓰면 오타입니다? – lebolo

응답 주셔서 감사합니다 - particle.position.y는 나를 위해 오류를 반환합니다; particle.y는 그렇지 않습니다. 문서를 살펴봤을 때, '입자'와 같은 Vector3s는 'y'를 속성 중 하나로 사용하는 것 같습니다. – user3549051

오래된 서적과 자습서는 사용하지 마십시오. 예전 버전의 라이브러리에 링크 된 예는 피하십시오. 학습 한 예제는 3 년 된 3 개의 .js 버전을 사용하고 있습니다. – WestLangley

보인다.

출처

2014-04-18 16:43:40 lebolo

감사합니다. particle.y보다는 particle.setY()를 사용하는 것이 트릭을 완료 한 것 같습니다. – user3549051

'particle.y'를 사용하여 저에게 효과가 있었지만 아무런 문제가 없었습니다 - 어느 것이 더 선호되는지는 잘 모르겠습니다 =) – lebolo

나는 정확히 같은 튜토리얼에서 동일한 문제가 발생하지만, 사용 ThreeJS 86, 나는 어느 것도 setY()이나 particleSystem.sortParticles = true;하지만 particleSystem.geometry.verticesNeedUpdate = true; (하지particleSystem.geometry.vertices.needsUpdate = true;)을 필요로했다.

출처

2017-07-26 15:39:57

Three.JS 입자 시스템 내에서 개별 입자 이동

답변

관련 문제