ТРЕТИЙ. Петля не проигрывает анимацию - PullRequest
Новая
       10

ТРЕТИЙ. Петля не проигрывает анимацию

1 голос
/ 01 октября 2019

в загрузчике я устанавливаю действие в режиме loopOnce, но при анимации страницы обновления не воспроизводится, когда я удаляю анимацию loopOnce, воспроизводящуюся вечно

Я хочу запустить анимацию «Intro» при первой загрузке, а также один раз добавляю функцию clipWhenFinished ивключить атрибут, но не работает снова

ВЕРСИИ: я вижу последние три версии js, файл gld

Файл модели 

var scene, renderer;
var camera;
var mesh;
var clickDown;
var model;
var mixer, clock; // declare variables globally
var animations;
var action;

var isMouseDown = false;

function execFA() {
    scene = new THREE.Scene();
    clock = new THREE.Clock(); // create clock
    camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
    camera.position.z = 25;
    camera.position.y = 7;
    renderer = new THREE.WebGLRenderer();
    renderer.setSize(window.innerWidth, window.innerHeight);
    document.getElementById('container').appendChild(renderer.domElement);

    renderer.setClearColor(0x00ffff, 1);
    renderer.gammaOutput = true;


    var light = new THREE.DirectionalLight("#c1582d", 1);
    var ambient = new THREE.AmbientLight("#85b2cd");
    light.position.set(0, -70, 100).normalize();
    scene.add(light);
    scene.add(ambient);

    var texture = new THREE.Texture();
    var manager = new THREE.LoadingManager();
    manager.onProgress = function(item, loaded, total) {};
    var onProgress = function(xhr) {};
    var onError = function(xhr) {};

    // 3Dモデル用テクスチャ画像の読込
    var loader = new THREE.GLTFLoader();

    // Load a glTF resource
    loader.load(
        // resource URL
        './models/carboard.glb',
        // called when the resource is loaded
        function(gltf) {
            model = gltf;
            mesh = gltf.scene;
            mesh.scale.set(3, 3, 3);
            animations = gltf.animations;
            console.log(gltf.animations);
            console.log(gltf.scenes);
            var clip = THREE.AnimationClip.findByName(gltf.animations, "Intro");
            mixer = new THREE.AnimationMixer(mesh);
            console.log(clip);

            action = mixer.clipAction(clip);
            action.clampWhenFinished = true;
            action.enable = true;
            action.setLoop(THREE.LoopOnce); // hereeeee

            action.play();
            console.log(action);

            scene.add(mesh);
            animate();
            render()

        },
        function(xhr) {

            console.log((xhr.loaded / xhr.total * 100) + '% loaded');

        },
        function(error) {

            console.log('An error happened', error);

        }
    );

    document.addEventListener("mousedown", onMouseDown);
    document.addEventListener("touchstart", onMouseDown);
    document.addEventListener("mouseup", onMouseUp);
    document.addEventListener("touchend", onMouseUp);
    document.addEventListener("mousemove", onMouseMove);
    document.addEventListener("touchmove", onMouseMove);
    render();
}

function animate() {
    // render();

    requestAnimationFrame(animate);
}

function render() {
    if (model) {
        if (isMouseDown) {
            mixer = new THREE.AnimationMixer(mesh);

            var clip = THREE.AnimationClip.findByName(animations, 'Rotate');
            action = mixer.clipAction(clip);
            action.setLoop(THREE.LoopOnce);

            action.play();
        }


        requestAnimationFrame(render);
        var delta = clock.getDelta();
        mixer.update(delta); // update animation mixer
        renderer.render(scene, camera);


    }

}


function onMouseDown(event) {
    isMouseDown = true;


}
function onMouseMove(event) {
    if (isMouseDown) {
        if (mesh) {

        }
    }
}
function onMouseUp(event) {
    isMouseDown = false;
}
function getMouseX(event) {}
function getMouseY(event) {}
    window.addEventListener('DOMContentLoaded', execFA());
...