Javascript 基于WebGL的多尺度巨型三维体绘制

我正在使用WebGL渲染一个巨大的3D体积，光线投射算法在着色器（glsl）中实现。该卷是从生物图像堆栈创建的。我想做的是在渲染这个3D体积时保持平滑的放大和缩小。但是图像堆栈是高分辨率的，为了获得实时性能，我需要使用八叉树。你对我如何实施有什么建议吗

我不认为只有WebGL就可以在GPU上获得八叉树-它只支持OpenGL ES 2.0，因此可能太少，无法实现一些像样的八叉树

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

然后，当您看到用户开始移动/缩放视图时，可以打开“低清晰度”渲染以获得更多fps。在这个移动过程中，用户不会注意到运动图像的质量有太大的损失，当他停止更改相机时，您将再次渲染场景，但渲染的是目标质量

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

我知道这并不理想，但可能会为您提供很好的服务，我看到很少有更大的gfx应用程序使用这种技巧

---

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

您是否只需要javascript中的八叉树实现？我想应该不难找到。它被用于色彩空间分区，但应该不难适应。