Three.js: скриншот сцены в высоком разрешении - PullRequest
0 голосов
/ 04 сентября 2018

Я пытаюсь создать снимок экрана с высоким разрешением для фиксированного кадра моей анимации. У меня есть постоянно вращающийся элемент, который я анимирую, используя .rotation.set () и .setFromRotationMatrix () (применяемый, когда вы манипулируете им с помощью touchmove), а затем сбрасываю вращение моего элемента, чтобы он экспортировался в правильном виде в изображение, и оно работает, но часто оно также не может захватить его при правильном вращении, как если бы у него не было времени, чтобы захватить его или не было должным образом сброшено.

Есть намеки? Вот мой код захвата и сброса.

 let oldRotation;
function resetDefaults() {
// A.renderer.setSize(3000, 3000);
A.play = false;

A.renderer.setSize(2100, 2100);

oldRotation = {
    heart: A.heart.rotation.y,
    heartParts: [
        A.heartParts[0].rotation.y,
        A.heartParts[1].rotation.y,
        A.heartParts[2].rotation.y,
    ]
};
A.camera.aspect = 1;
A.camera.updateProjectionMatrix();
A.renderer.setClearAlpha(0);
A.renderer.setClearColor(0xffffff, 0.0);
A.scene.background = null;
A.planeBottom.visible = false;
if(!A.isMobile) {
    A.particle.mesh.visible = false;
    A.fullParticle.mesh.visible = false;
}

//w.document.body.style.backgroundColor = "red";
var img = new Image();

// Without 'preserveDrawingBuffer' set to true, we must render now
A.heart.rotation.y = 1;
A.heartParts[0].rotation.y = 0;
A.heartParts[1].rotation.y = 0;
A.heartParts[2].rotation.y = 0;

A.renderer.render(A.scene, A.camera, null, false);
img.src = A.renderer.domElement.toDataURL();


setToPrevious(img);   

}

function setToPrevious(img, color) {
A.camera.aspect = window.innerWidth / window.innerHeight;
A.camera.updateProjectionMatrix();

A.renderer.setSize(window.innerWidth, window.innerHeight);
A.heart.rotation.y = oldRotation.heart;
A.heartParts[0].rotation.y = oldRotation.heartParts[0];
A.heartParts[1].rotation.y = oldRotation.heartParts[1];
A.heartParts[2].rotation.y = oldRotation.heartParts[2];
A.planeBottom.visible = true;
if (!A.isMobile) {
    A.particle.mesh.visible = true;
    A.fullParticle.mesh.visible = true;
}
A.play = true;
setTimeout(()=> {
    sendOver(img.src, color);  
}, 400)
}`enter code here`

https://jsbin.com/tuhesuvofe

И живой пример на https://ahumanbody.com

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...