three.js[已解决]拾取区域和SelectionBox.js

亲爱的各位。
我正在使用一个three.js场景，并实现了硬件实例。我的信息来自CATIA big CATPRODUCTS，我们希望优化场景构建过程，并有一个内存优化的解决方案。为了尽可能快，我使用WEBGL2着色器。
我将所有依赖实例的属性作为IntancedBufferAttributes（实例ID、颜色、可见、变换矩阵等）
我尝试使用该模块SelectionBox.js为了能够执行拣货区域选择，但是该模块不适用于实例。
我的想法是在透视相机的近平面上投影一个平面，并绘制一个边界框，将3d框从投影到远平面的正方形中提取出来。其思想是将当前的BoxSelectio
作为（xmin，ymin，zmin），（xmax，ymax，zmax）作为统一传递给我的着色器，如果顶点不包含在作为统一传递的bbox中，则丢弃片段。由于此操作在顶点着色器中很容易计算为三位数范围条件匹配，因此，我们的想法是在顶点中计算此操作，并将变量传递给片段着色器，如果变量为零，则该着色器将丢弃该变量，如果变量为>；0，则显示该变量。我的主要问题是，我不知道如何从选定的2D画布正方形投影我的另一个问题是如何将带有所选区域的补丁的所有PartId传递给CPU，以便在事件中将此信息发送到应用层，以便将此选择与可以看到CATPRODUCT的Procut结构的JSTREE对象同步。我认为最好的选择是在共享缓冲区中传递这些信息，但我不知道如何实现它。为了避免GPU和CPU之间的阻塞IO，我使用了PBO进行单点实例选择，但不知道如何以这种方式使用它来传递InstanceId数组，这是正确的方法吗？还有更好的主意吗？有人能帮我吗？
非常感谢advanced。
大家好。
最后，我开发了自己的selectionHelper和BoxSelectio
来处理实例。
无论如何感谢
Alejandro_Insua:
为了尽可能快，我正在使用WEBGL2着色器。
只是为了避免混淆：将着色器移植到更新的GLSL语法但这并不意味着它更快。您必须使用WebGL 2的特定功能，例如，统一缓冲区对象在渲染期间的性能确实有所提高。WebGL 1也提供了实例化或VAOs之类的功能。
亲爱的Mugen。
非常感谢您的回复。
最后，我选择了使用实例但不使用透视摄影机的选项。
重点是我需要使选择框也适用于透视摄影机。
我附上一个示例，以便您看到问题，当您双击activa选择区域，但使用ortographic照相机时，您会看到该区域不工作。
我认为问题出在createFrustum函数上，但我不像您那样是一名验光员。
您能给点提示吗？
非常感谢advanced对您的支持。
向您致以最诚挚的问候
以下是代码：three.jswebgl-场景动画主体{font-family:Monospace；背景色：#f0f0；边距：0px；溢出：隐藏；}n。选择框{border:1px-solid#55aaff；背景色：rgba（75，160，255，0.3）；位置：=mat4（vec4（mcol0，0），vec4（mcol1，0)，vec4（mcol2，0），vec4（mcol3，1=vec3（modelViewMatrix*vec4（cameraPosition，1.0=log2（max（EPSILON，gl_Position.w+1.0））==log2（vFragDepth）*logDepthBufFC*=new3X.RenderStats（）变量容器，统计信息；变量选择框，=new=new三、ShaderMaterial（{vertexShader:#版本300 es\\n“+vert，碎片着色器：“#版本300 es\\n”+碎片，透明：真，侧面：三、双面，clipping:true，clipShadows:false}）；材料学家（material=={x:0，y:true；selectionHelper.onSelectStart（事件）；}.bind（selectionHelper），false）；selectionHelper.renderer.DoElement.addEventListener（“鼠标移动”，函数（事件）{if（selectionHelper.isDown) {selectionHelper.onSelectMove（事件）；}}.bind（selectionHelper），false）；selectionHelper.renderer.DoElement.addEventListener（“mouseup”，函数（事件==true）{selectionHelper.renderer.DoElement.parentElement.appendChild( = = == = Math.min( selectionHelper.startPoint.y，= ( selectionHelper.pointBottomRight.y-selectionHelper.pointTopLeft.y）+==true）{selectionHelper.element.parentElement.removeChild（selectionHelper.element==起始点=函数（起始点，端点）{console.log（“起点”，起点，=Math.min（startPoint.x，==新建3.Vector3（tmpPoint.x，endPoint.y，0）；vecTopLeft.unproject( 选择框。照相机);vecTopRight.unproject( 选择框。照相机);完全不投射( 选择框。照相机);vectdownlight.unproject( 选择框。照相机=新的三，飞机();planeTop.setFromCoplanarPoints（vecNear、vecTopLeft、vecTopRight=新建三，飞机();planeFront.setFromCoplanarPoin [Solved] Picking area and SelectionBox.jsn

three.js[已解决]拾取区域和SelectionBox.js

three.js[已解决]正交摄影机的变换控件：gizmos缩放问题

three.js多次渲染同一模型（obj模型），FPS要低得多

three.js可缩放场景背景

three.js移动导入的Gltf模型

three.js平面明暗处理的问题

three.js如何渲染立方体材质？

three.js如何创建要在网格中拟合的线段

three.jsGLTFLoader.js这是我的登记簿错误

three.js使用threejs的光流

three.js使用光线投射动态绘制多边形