Как обнаружить столкновение в webgl?

Как обнаружить коллизию в webgl, не используя никакой библиотеки, подобной three.js?

4 5
javascript opengl-es collision-detection

4 ответа:

Как обнаружить столкновение в webgl

WebGL, как и OpenGL, предназначен только для рисования. Он не управляет сценой, у него нет понятия "объектов" или таких высокоуровневых вещей, как столкновения. Все дело в точках, линиях, треугольниках и шейдерах.

Все, что связано с управлением сценами или коллизиями, лежит за пределами сферы действия WebGL (и OpenGL).

13

Простой подход это сделать обнаружение столкновения лучей на GPU. Проверьте следующую запись в блоге по этой теме.

Http://blog.xeolabs.com/ray-picking-in-scenejs

Основная идея заключается в том, чтобы визуализировать сцену в текстуру (используя FBO) с помощью шейдера, который сохраняет идентификаторы объектов вместо цвета. Затем вы можете очень быстро выполнить поиск в этой текстуре, чтобы увидеть, с чем сталкивается луч.

3

С воскресенья я пытаюсь решить ту же самую проблему. Хотя в www есть много информации, я не смог заставить ее работать на моем примере-программе. Как только я решу ее, я опубликую свой пример здесь.

Моей последней попыткой было использовать порт glu-unProject для webGL. Для этого нужны следующие параметры:

Функция(Винкс, вини, винца, модель, проекция, вид, 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]
);

Это.я знаю и это.iHeight-это ширина/высота холста и видового экрана.пластмаус.икс & .y-координаты мыши внутри холста 

zI.debug(aTest);

Но в результате получается полное дерьмо. Я думаю, что в моем коде есть несколько ошибок. Я начал играть с WebGL только в прошлую пятницу. Я не хотел сдаваться так рано, но с тех пор я решил много проблем, но эта сводит меня с ума.

В openGL мне было гораздо легче.
1

Я бы рекомендовал следующую веб-страницу (к сожалению, только на немецком языке) http://www.peter-strohm.de/webgl/webgltutorial8.php

Мы смогли реализовать обнаружение коллизий и даже могли выполнять вызовы API на сервере, используя сопоставление идентификаторов (например, показывать подсказки с дополнительной информацией для определенного объекта в сцене).

Я надеюсь, что это немного поможет.

1