Cách phát hiện va chạm trong webgl?

Question

Cách phát hiện va chạm trong webgl, mà không sử dụng bất kỳ thư viện nào như three.js?

Answer 1

Làm thế nào để phát hiện va chạm trong webgl

Bạn không có. WebGL, như OpenGL chỉ dành cho các công cụ vẽ. Nó không quản lý một cảnh, nó không có khái niệm "đối tượng" hoặc những thứ cấp cao như va chạm. Đó là tất cả về điểm, đường nét, hình tam giác và bóng đổ.

Mọi nội dung liên quan đến quản lý cảnh hoặc xung đột nằm ngoài phạm vi của WebGL (và OpenGL).

Answer 2

Cách tiếp cận đơn giản là phát hiện xung đột tia trên GPU. Kiểm tra bài đăng trên blog sau về chủ đề.

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

Ý tưởng chính là để render hiện trường để một kết cấu (sử dụng một FBO) sử dụng một Shader mà tiết kiệm id đối tượng thay vì màu. Sau đó, bạn có thể nhanh chóng thực hiện tra cứu kết cấu này để xem tia nào va chạm với nhau.

Answer 3

Kể từ chủ nhật, tôi đang cố giải quyết cùng một vấn đề. Mặc dù có nhiều thông tin trong www, tôi không thể làm cho nó hoạt động trên chương trình ví dụ của tôi. Ngay sau khi tôi giải quyết nó, tôi sẽ đăng ví dụ của tôi ở đây.

Lần thử cuối cùng của tôi là sử dụng cổng glu-unProject cho webGL. Cái này cần các thông số sau:

function (winx, có mùi rượu, winZ, mô hình, Proj, xem, objPos)

Tôi đã cố gắng để gọi chức năng này trực tiếp từ chức năng cảnh vẽ của tôi cho mục đích thử nghiệm.

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 là vải và khung nhìn rộng/chiều cao - this.pLastMouse.x & .y là chuột tọa độ bên trong vải

zI.debug(aTest); 

Nhưng kết quả là hoàn toàn crap. Tôi đoán có một số lỗi trong mã của tôi. Tôi đã bắt đầu chơi với WebGL vào thứ sáu tuần trước. Tôi không muốn từ bỏ điều đó sớm, nhưng tôi đã giải quyết được nhiều vấn đề từ đó, nhưng điều này khiến tôi phát điên.

Trong openGL nó dễ dàng hơn nhiều với tôi.

Answer 4

Tôi muốn giới thiệu trang web sau (tiếc là chỉ có sẵn bằng tiếng Đức) http://www.peter-strohm.de/webgl/webgltutorial8.php

Chúng tôi đã có thể thực hiện phát hiện va chạm và thậm chí có thể thực hiện cuộc gọi API trên một máy chủ sử dụng bản đồ id (ví dụ như chương trình tooltips với thêm thông tin cho một đối tượng nhất định trong cảnh).

Tôi hy vọng điều này sẽ giúp ích một chút.