THREE.js 静态场景，检测 webgl 渲染何时完成 [英] THREE.js static scene, detect when webgl render is complete

问题描述

我正在创建一个包含很多对象的静态场景，我想在渲染后将其保存为图像.我如何在 THREE.js r69 中做到这一点?

I am creating a static scene with a lot of objects and I want to save as image after it is rendered. How do I do that in THREE.js r69?

推荐答案

很可能，你的方向不对.

Most probably, you are not going in the right direction.

如果你有这样的功能

function animate() {
    requestAnimationFrame(animate);
    render ();
}

渲染一直在工作.

当您看到场景未完成时，这是因为网格尚未完成加载，而不是因为渲染尚未完成渲染.

When you are seeing the scene unfinished, it's because the meshes haven't finished loading, not because the render hasn't finished rendering.

所以，你必须在你加载的模型上监听一些 onload 事件，这取决于你用来加载它们的方法(而且你没有解释，所以我不能帮你更多)

So, you have to listen for some onload event on the models that you are loading, that will depend on the method that you use to load them (and that you don't explain, so I can't help you more)

根据您回复中的代码，不清楚何时将网格添加到场景中.无论如何，我会尝试

Given the code in your reply, it isn't clear when you add the mesh to the scene. Anyway, I would try something in the line of

function loaderCallback() {
    mesh = new THREE.Mesh (...
    scene.add (mesh);
    requestAnimationFrame(saveImage);
    render ();
}

应在渲染完成时调用 requestAnimationFrame 调用的函数.

the function invoked at requestAnimationFrame should be called when render finishes.

这篇关于THREE.js 静态场景，检测 webgl 渲染何时完成的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！