Aframe Непосредственное обновление свойств aframe-частиц-системы-компонента в режиме реального времени без setAttribute () - PullRequest
1 голос
/ 15 октября 2019

Я использую aframe-частиц-система-компонент и использовал .setAttribute() в функции tick() для обновления системы частиц в режиме реального времени, но она работала ужасно, что приводило кпочти мгновенные сбои, связанные с памятью. Есть ли способ прямого доступа к свойствам maxAge, opacity и enabled системы? Я предполагаю, что это лучший способ справиться с этим, так как фреймворк сообщает, что к .object3D напрямую обращаются из соображений производительности. Я хотел бы иметь возможность получить доступ к системе частиц аналогичным образом. Любая помощь приветствуется.

1 Ответ

2 голосов
/ 15 октября 2019

tldr: вот пример с анимированной непрозрачностью, размером и некоторыми переключателями. Переключение максимального возраста, кажется, ждет, пока все текущие частицы исчезнут, хотя в docs .

1 нет ни слова об этом. Потрошение системы частиц

Система частиц основана на ShaderParticleEngine , поэтому модификация не будет такой, как THREE.js'ish.

Из того, что я могу сказатьparticle-system создает и хранит SPE.Emitter. Вы можете получить к ним доступ здесь:

let particleSystem = this.el.component['particle-system']
let emitterGroup = particleSystem.particleGroup.emitters

Изменение значений - например, если у вас есть один излучатель:

emitterGroup[0].disable()           // disables the emitter
emitterGroup[0].opacity.value = 0.1 // sets the opacity

2. Задание для рамочных пользовательских компонентов

Я бы создал пользовательский компонент, который при любом изменении будет перебирать группу эмиттеров и изменять атрибуты:

AFRAME.registerComponent('particle-controller', {
   schema: {
      opacity: {default: 1}
   },
   init: function() {
      let system = this.el.components['particle-system']
      this.emitterGroup = system.particleGroup.emitters
   },
   update: function() {
      this.setValueInEmitters(this.emitterGroup, 'opacity', this.data.opacity)
   },
   // may come in handy when changing more key-value pairs
   setValueInEmitters(group, prop, value) {
     for (let i = 0; i < group.length; i++) {
        group[i].prop.value = value
     }
   }
}) 

Схема может бытьподается парами ключ-значение или тому подобное, чтобы сделать компонент более универсальным.

3. Почему setAttribute такой тяжелый

Собирая из исходного кода , любое изменение удаляет старую группу частиц и создает новую с нуля.

...