Javascript GPU拾取加载的GLTF对象

在询问之前，我已经尝试了很多方法来解决这个问题，现在我真的不知道如何在gltf加载的文件上使用gpu完成对象拾取，所以我希望能得到任何帮助：(

我加载了一个巨大的GLTF文件，其中有很多小对象，由于文件数量的原因，如果我只是将它们添加到场景中，就不可能获得好的fps，因此我设法实现了60 fps，将gltfs子对象合并到块中，但是当我尝试实现webgl_interactive_cubes_gpu示例时，它似乎对我不起作用，当我点击时，我总是得到相同的对象

为了调试，我尝试过渲染pickingScene，从图形上说，一切都准备就绪，但是当涉及到picking时，它似乎并不像我预期的那样工作，除非我做错了什么

光线投射拾取对我来说不是一个合适的选项，因为有很多对象，添加渲染会杀死fps（55k个对象）

以下是gltf加载后的代码：

var child = gltf.scene.children[i];
                    var childGeomCopy = child.geometry.clone();
                    childGeomCopy.translate(geomPosition.x, geomPosition.y, geomPosition.z);
                    childGeomCopy.scale(child.scale.x * Scalar, child.scale.y * Scalar, child.scale.z * Scalar);
                    childGeomCopy.computeBoundingBox();
                    childGeomCopy.computeBoundingSphere();
                    childGeomCopy.applyMatrix(new THREE.Matrix4());

                    geometriesPicking.push(childGeomCopy);

                    var individualObj = new THREE.Mesh(childGeomCopy, IndividualObjMat);
                    individualObj.name = "individual_" + child.name;

                    pickingData[childCounter] = {
                        object: individualObj,
                        position: individualObj.position.clone(),
                        rotation: individualObj.rotation.clone(),
                        scale: individualObj.scale.clone()
                    };
                    childCounter++;

编辑：

。。。 var pickingGeom=三个.BufferGeometryUtils.mergebuffergeometrics（geometriesPicking）； pickingGeom.rotateX（三个.数学.degToRad（90））；pickingScene.add（新的三个.网格（pickingGeom，pickingMaterial））

然后，在MouseUp函数中，我调用pick（mouse*）并传入mouse*信息：

function pick(mouse) {
camera.setViewOffset(renderer.domElement.width, renderer.domElement.height, mouse.x * window.devicePixelRatio | 0, mouse.y * window.devicePixelRatio | 0, 1, 1);
renderer.setRenderTarget(pickingTexture);
renderer.render(pickingScene, camera);
camera.clearViewOffset();
var pixelBuffer = new Uint8Array(4);
renderer.readRenderTargetPixels(pickingTexture, 0, 0, 1, 1, pixelBuffer);
var id = (pixelBuffer[0] << 16) | (pixelBuffer[1] << 8) | (pixelBuffer[2]);
var data = pickingData[id];

if (data) {
    console.log(data.object.name, ":", data.position); // Always return the same object
}}

功能拾取（鼠标）{
camera.setViewOffset（renderer.domeElement.width、renderer.domeElement.height、mouse.x*window.devicePixelRatio | 0、mouse.y*window.devicePixelRatio | 0、1、1）；
setRenderTarget（pickingTexture）；
渲染器。渲染（拾取场景、摄影机）；
camera.clearViewOffset（）；
var pixelBuffer=新的Uint8Array（4）；
readRenderTargetPixels（pickingTexture，0，0，1，1，pixelBuffer）；
变量id=（像素缓冲区[0]使用对象ID生成顶点颜色的代码在哪里？如果你看一看，你会发现这是一个静态场景，它创建了一个巨大的几何体，可以从中选择顶点颜色映射到对象ID。@gman嘿，谢谢你的回答，我设法使它与我正在加载的gltf中的单个对象一起工作。你能帮我解开吗rstand如果在模型上渲染potree pointcloud会如何影响对象的拾取？因为当我在示例上尝试时，它是有效的，但是当我在运行potree的点云上尝试时，它总是在我记录“数据”时输出索引0，我想也许我需要一起关闭potree引擎才能在它更改SetRenderTarget时工作。有没有办法从相机创建视图“setViewOffset”？
function pick(mouse) {
camera.setViewOffset(renderer.domElement.width, renderer.domElement.height, mouse.x * window.devicePixelRatio | 0, mouse.y * window.devicePixelRatio | 0, 1, 1);
renderer.setRenderTarget(pickingTexture);
renderer.render(pickingScene, camera);
camera.clearViewOffset();
var pixelBuffer = new Uint8Array(4);
renderer.readRenderTargetPixels(pickingTexture, 0, 0, 1, 1, pixelBuffer);
var id = (pixelBuffer[0] << 16) | (pixelBuffer[1] << 8) | (pixelBuffer[2]);
var data = pickingData[id];

if (data) {
    console.log(data.object.name, ":", data.position); // Always return the same object
}}