在Three.js中是否有处理帧缓冲区对象(FBO';s)的方法?

在Three.js中是否有处理帧缓冲区对象(FBO';s)的方法?,three.js,framebuffer,Three.js,Framebuffer,我正在学习使用纹理a.k.a.,帧缓冲区对象(FBO)在GPU中操纵位置值,同时使用Three.js。我一直在用这个作为起点,@mrdoob和@zz85的这个,还有这个 然而,这些示例非常陈旧(示例使用three.js rev.55和当前的rev.80),因此我需要对代码进行大量的修改和重写。在我深入讨论之前,我想停下来问问是否有任何处理FBO的方法已经写入到Three.js代码库中,或者我是否忽略了某个更新的脚本。谢谢 如果没有,我会尽我最大的努力,如果结果看起来普遍有用的话,也许会在这里发布

我正在学习使用纹理a.k.a.,帧缓冲区对象(FBO)在GPU中操纵位置值,同时使用Three.js。我一直在用这个作为起点,@mrdoob和@zz85的这个,还有这个

然而,这些示例非常陈旧(示例使用three.js rev.55和当前的rev.80),因此我需要对代码进行大量的修改和重写。在我深入讨论之前,我想停下来问问是否有任何处理FBO的方法已经写入到Three.js代码库中,或者我是否忽略了某个更新的脚本。谢谢


如果没有,我会尽我最大的努力,如果结果看起来普遍有用的话,也许会在这里发布。

我刚刚发现,在Three.js中有一种方法可以处理帧缓冲区对象(FBO)来计算诸如使用GPU更改位置数据之类的事情;它被称为。这里有一个优秀的鸟群示例,演示了如何通过将大量变量的值渲染为纹理来传递这些变量,以便在最终着色器中使用。

如果您想“弹出引擎盖”,我想在THREE.js中分享一个FBO场景的绝对最小示例。希望内联注释有助于说明这两者是如何结合在一起的:

//指定渲染场景的容器
var elem=document.querySelector('body'),
elemW=elem.clientWidth,
elemH=elem.clientHeight
//生成场景对象
var scene=new THREE.scene();
//生成相机
var摄像机=新的三视角摄像机(75,elemW/elemH,0.001100);
//生成渲染器
var renderer=new THREE.WebGLRenderer({antialas:true,alpha:true});
renderer.setPixelRatio(window.devicePixelRatio);
设置大小(elemW,elemH);
元素appendChild(renderer.doElement);
//生成控件
var controls=新的三个.trackball控件(摄影机、渲染器.domElement);
//定位摄像机和控制器
摄像机位置设置(0.5,0.5,-5);
controls.target=新的三个向量3(0.5,0.5,0);
/**
*FBO
**/
//验证浏览器代理是否支持“帧缓冲区对象”功能
gl=renderer.getContext();
如果(!gl.getExtension('OES\u纹理\u浮动')||
gl.getParameter(gl.MAX_顶点_纹理_图像_单位)==0){
警报('*无法创建FBO:(');
}
//设置“w*h”粒子的初始位置
var w=h=256,
i=0,
数据=新阵列(w*h*3);
对于(var x=0;x