Я действительно пробовал каждый пример, обыскал в Интернете часами, но я не могу заставить его работать!Доступ к отдельным частицам в системе частиц THREE.js
Так что я просто пытался реализовать небольшую систему частиц, имитирующую падающий снег, так же, как это: http://www.aerotwist.com/tutorials/creating-particles-with-three-js/
Но я могу только получить доступ к нему в целом. Это значит, что я могу повернуть его как таковой, но как только я попытаюсь перебрать его вершины, вся анимация получает икоту! Я бы очень признателен за помощь здесь!
-
Вот основные части:
-> Настройка системы частиц:
var partikelGeo = new THREE.Geometry();
var partikelMaterial = new THREE.ParticleBasicMaterial({
color:0xffffff,
size: 10,
map: THREE.ImageUtils.loadTexture('snowflake2.png'),
blending: THREE.AdditiveBlending,
transparent:true
});
var partikelAnzahl = 3500;
for (var p = 0; p < partikelAnzahl; p++) {
var pX = Math.random() * 1000 -500;
var pY = Math.random() * 1000 -500;
var pZ = Math.random() * 1000 -500;
var partikel = new THREE.Vertex(new THREE.Vector3(pX,pY,pZ));
partikel.velocity = new THREE.Vector3(0,-Math.random(),0);
partikelGeo.vertices.push(partikel);
}
var partikelSystem = new THREE.ParticleSystem(partikelGeo, partikelMaterial);
partikelSystem.sortParticles = true;
scene.add(partikelSystem);
-> Rendering & Анимация на Mouseclick
var frame = 0;
function animate(){
// request new frame
requestAnimationFrame(function(){
animate();
});
// render
render();
}
animate();
var check = 0;
onmousedown = function(){
if (check) {
check = 0;
}else{
check = 1;
}
}
function render() {
if (check) {
clickDo();
}
camera.lookAt(new THREE.Vector3(0,0,0));
renderer.render(scene,camera);
}
function clickDo() {
frame++;
partikelSystem.rotation.y += 0.01;
var pCount = partikelAnzahl;
while(pCount--) {
// get the particle
var particle =
partikelGeo.vertices[pCount];
// check if we need to reset
if(particle.position.y < -200) {
particle.position.y = 200;
particle.velocity.y = 0;
}
// update the velocity with
// a splat of randomniz
particle.velocity.y -=
Math.random() * .1;
// and the position
particle.position.addSelf(
particle.velocity);
}
// flag to the particle system
// that we've changed its vertices.
partikelSystem.
geometry.
__dirtyVertices = true;
}
Rah
что вы хотите сделать с этой частицей? обычно вам нужно использовать шейдеры для этой цели (здесь есть учебное пособие http://www.aerotwist.com/tutorials/an-introduction-to-shaders-part-1/). Но если вы хотите просто изменить положение одиночной частицы, вы можете выбрать ее из partikelGeo.vertices, изменить ее координаты, а затем установить флаг partikelGeo.verticesNeedUpdate в true (в старых версиях three.js, я думаю, это partikelGeo .__ dirtyVertices = true). – dIsoVi