如何在不使用像three.js这样的库的情况下检测webgl中的冲突?
如何检测webgl中的冲突?
How to detect collision in webgl?
===============>>#1 票数:13 已采纳
如何检测webgl中的冲突
你没有。 像OpenGL一样,WebGL仅用于绘制内容。 它不管理一个场景,它没有“对象”的概念或像碰撞这样的高级别的东西。 这些都是关于点,线,三角形和着色器的。
与场景管理或冲突相关的任何内容都不在WebGL(和OpenGL)的范围之内。
===============>>#2 票数:3
一种简单的方法是在GPU上进行射线碰撞检测。 查看以下有关该主题的博文。
http://blog.xeolabs.com/ray-picking-in-scenejs
主要思想是使用着色器将场景渲染到纹理(使用FBO),该着色器可以保存对象ID而不是颜色。 然后,您可以非常快速地在此纹理中查找以查看光线与之碰撞的内容。
===============>>#3 票数:1
从星期天开始,我正试图解决同样的问题。 虽然www中有很多信息,但我无法让它在我的示例程序上运行。 一旦我解决了,我就会在这里发布我的例子。
我的最后一次尝试是使用glu-unProject端口进行webGL。 这个需要以下参数:
功能(winX,winY,winZ,model,proj,view,objPos)
我试图直接从我的场景绘图功能调用此函数进行测试。
var pMatrix = new mat4.ortho(iL, iR, iB, iT, fNearZ, farZ);
var mvMatrix = new mat4.create();
mat4.identity(mvMatrix);
mat4.translate(mvMatrix,[0,0,-40]);
var oMouseMatrix = mat4.create();
mat4.identity(oMouseMatrix);
//Rotate eye :-S
mat4.rotate(oMouseMatrix,((this.fAnimationXAngle/10) * Math.PI) / 360.0,[0,1,0]);
mat4.rotate(oMouseMatrix,((this.fAnimationYAngle/10) * Math.PI) / 360.0,[1,0,0]);
mat4.multiply(oMouseMatrix, mvMatrix, mvMatrix);
//Rotate model
mat4.rotateX(mvMatrix,this.fRotX * Math.PI / 180.0);
mat4.rotateY(mvMatrix,this.fRotY * Math.PI / 180.0);
mat4.rotateZ(mvMatrix,this.fRotZ * Math.PI / 180.0);
var aTest = this.unProject(
this.pLastMouse.x,
this.pLastMouse.y,
0,
mvMatrix,
pMatrix,
[0,0,this.iWidth,this.iHeight]
);
this.iWidth&this.iHeight是画布和视口宽度/高度 - this.pLastMouse.x和.y是画布内的鼠标坐标
zI.debug(aTest);
但结果完全是废话 。 我想我的代码中有几个错误。 我上周五开始玩WebGL。 我不想早点放弃,但从那时起我就解决了许多问题,但是这个问题让我发疯了。
在openGL中,它对我来说要容易得多。
===============>>#4 票数:1
我推荐以下网页(不幸的是只提供德语版) http://www.peter-strohm.de/webgl/webgltutorial8.php
我们能够实现冲突检测,甚至可以使用id映射在服务器上执行API调用(例如,显示工具提示,其中包含场景中某个对象的附加信息)。
我希望这个能有一点帮助。