перестали работать элементы управления рамкой кадров, когда реализована функция анимации - PullRequest
Новая
       9

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

0 голосов
/ 13 января 2019

Я реализую одушевленную функцию рендерера для расширения некоторых функций. 

this.scene = document.querySelector('a-scene').object3D;
this.renderer = document.querySelector('a-scene').renderer;

var comp = this;
this.scene.children.forEach(element => {

    element.traverse(function (node) { 

        if(node.type === "PerspectiveCamera"){
            comp.camera = node;
            comp.renderer.animate( update )
        }
    });
}); 

function update(){

    if(THREE.VRController){
        THREE.VRController.update();
    }

    var scene = document.querySelector('a-scene').object3D;
    var renderer = document.querySelector('a-scene').renderer;

    scene.children.forEach(element => {

        element.traverse(function (node) { 

            if(node.type === "PerspectiveCamera"){
                var camera = node;
                var lookcontrols = node.el.components['look-controls'];
                if(lookcontrols){
                    lookcontrols.play();
                }
                renderer.render( scene, camera );
            }
        });
    });

}

Когда я комментирую строку кода comp.renderer.animate (update) look-controls начинает работать. Я хочу сохранить реализацию выше, а также работать с look-control. Пожалуйста, предложите способ.

1 Ответ

0 голосов
/ 15 января 2019

Вот функция рендеринга A-Frame: 

        var renderer = this.renderer;

        this.frame = frame;
        this.delta = this.clock.getDelta() * 1000;
        this.time = this.clock.elapsedTime * 1000;

        if (this.isPlaying) { this.tick(this.time, this.delta); }

        renderer.render(this.object3D, this.camera, this.renderTarget);

Тики компонента вызываются на tick. Вы должны обернуть вызов рендеринга, чтобы расширить его, а не заменять полностью как: 

sceneEl.prototype.render = {
  value: function () {
    // Your code here.
    originalRender();
    // More of your code here.
  }
}
...