使用WebGL进行多尺度巨大的3D体积渲染

时间:2015-09-22 02:12:14

标签: javascript 3d webgl octree

我使用WebGL渲染巨大的3D体积,并且在着色器(glsl)中实现了光线投射算法。该体积是从生物图像堆栈创建的。我想要做的是在渲染这个3D体积时保持平滑放大和缩小。但是图像堆栈是高分辨率的,以获得我需要使用Octree的实时性能。您对我如何实施它有什么建议吗?

1 个答案:

答案 0 :(得分:0)

我认为你不会只使用WebGL获得GPU上的Octree - 它只支持OpenGL ES 2.0,因此实现一些不错的八叉树可能太少了。

然而,有一些技巧可能有助于解决您的问题。通常,您希望在缩放/移动期间加快渲染速度,但在可能的情况下保持目标质量。 您可以实现一些“低清”质量并在相机移动过程中使用它。最简单的方法是使用更大的光线投射步骤,您也可以准备一些较低分辨率版本的图像。

然后,当您看到用户开始移动/缩放视图时,您可以打开“低def”渲染以获得更多fps。在此运动过程中,用户不会注意到运动图像质量的大幅下降,当他停止更换相机时,您会再次渲染场景 - 但目标质量也是如此。

假设您的典型渲染需要1秒,而“低def”需要0.1秒。使用这种方法,您可以以~10fps的速度获得交互式相机移动,当您停止移动时,您将在1秒后获得最终图像。

我知道这不太理想,但可能会很好地为你服务,我看到很少有更大的gfx应用程序使用这个技巧。

一些稍微不同但相似的方法是在交互式移动期间渲染每个X像素中的一个。在某些3D建模应用程序中,当您更改视图/移动某个对象并启用光线跟踪预览时,您可能会注意到它只渲染所有像素的一部分,从而保持交互性。当你停止移动时,它会渲染剩下的像素。