草庐IT

webgl_interactive_voxelpainter

全部标签

javascript - 关于 JavaScript、WebSockets、WebGL 的问题

我见过很多关于其他客户端脚本语言的stackoverflow问题Internet正在成为一个内容非常丰富且充满活力的地方。HTML和CSS规范正试图将Web提升到一个新的水平——我们正在获得WebSockets支持,这对于全双工客户端-服务器通信来说非常好,使一些迷人的设计模式得以出现。此外,我们在JavaScript中有一个WebGL的工作实现,到目前为止我从中获得了很多乐趣。但这引起了一些担忧,至少对我而言。我是一名桌面程序员,C/C++/Objective-C——取决于平台。具体来说,渲染架构师。JavaScript为我们所有人提供了非凡的服务,不是吗?我们用它来获得与2D线性网

javascript - 如何将多个纹理发送到 WebGL 中的片段着色器?

所以在我的代码的javascript部分,这里是实际上将像素数组发送到顶点和片段着色器的片段-但当我到达那些着色器时我只使用1个纹理-无论如何我可以一次发送两个纹理吗?如果是这样,我将如何在编码器的GLSL端“捕获”它们?if(it>0){gl.activeTexture(gl.TEXTURE1);gl.bindTexture(gl.TEXTURE_2D,texture);gl.activeTexture(gl.TEXTURE0);gl.bindFramebuffer(gl.FRAMEBUFFER,FBO2);}else{gl.activeTexture(gl.TEXTURE1);gl

javascript - 使用 WebGL 将两个 Canvas 混合到一个 Canvas 上

我想要做的是将两个Canvas混合到一个Canvas上,用于我正在创建的绘图应用程序。我非常了解Javascript,但我真的不知道从哪里开始使用WebGL,因为这不是一项非常艰巨的任务,我假设如果我不使用它会产生更快的处理速度另一个库,如Three.js或其他类似的库。我已经拥有用户将在其上绘制的Canvas(我们称它们为CanvasA和B),它们都是隐藏的,CanvasC正在显示。我已经完成了主要的绘图应用程序,供用户选择要绘制的图层并在其上绘制,但是我如何才能使用WebGL使用某种混合模式(即:乘法)将两个图层混合在一起)随着用户继续使用WebGL编辑Canvas?起初我尝试关注

javascript - 是否可以隐藏/保护 webGL 中使用的数据?

学了一点webGL,主要用three.js。我加载.obj文件并以3D形式绘制它们。我已将我的项目放在网上,例如:www.mydomain.com我不介意人们通过他们的浏览器查看我的源代码,但我展示的.obj文件来自不想泄露它们的人。在这方面我完全是个新手。由于我的源代码可供所有人使用,我猜.obj文件也可供所有人使用。那么是否可以隐藏或保护它们,以便任何人都无法下载它们? 最佳答案 我敢肯定,如果您想在Javascript/WebGL中访问和使用任何文件,您将无法保护它们。它们需要在某个时候被解析为可用格式,以便浏览器/javas

javascript - webGL 是否包含 push/popMatrix?

webGL是否包含push/popMatrix?如果没有,我将如何重新创建它们? 最佳答案 不,WebGL基于OpenGLES2.0,因此没有内置矩阵管理或固定功能管道。模型View和投影矩阵需要在您自己的代码中完全管理,并在绘制时传递给着色器。如果您使用场景图或某种其他类似的场景管理系统,您真的不需要插入矩阵。您真正需要的只是一个好的矩阵和向量数学库。如果您仍然打算使用push和pop矩阵,您可以简单地使用一个矩阵数组,并编写像push和pop这样的函数,这些函数只需将您当前的矩阵保存到数组中,然后向下推送或弹出索引。如果您在过渡

javascript - 如何在 WebGL 中使用多个纹理?

我想在一个立方体上使用6种不同的纹理,每边一个,但找不到错误。这是我当前的代码:vartexturen=newArray();functioninitTexture(sFilename,texturen){varanz=texturen.length;texturen[anz]=gl.createTexture();texturen[anz].image=newImage();texturen[anz].image.onload=function(){gl.bindTexture(gl.TEXTURE_2D,texturen[anz]);gl.pixelStorei(gl.UNPACK

javascript - 是否可以使用 WebGL 最大纹理大小?

我正在开发一款分辨率越高越好的应用。但我被WebGLmax_texture_size问题困住了。我创建了一个尺寸正好是这个尺寸的图像(在我的笔记本电脑上是16384x16384),WebGL崩溃说:GL_INVALID_ENUM:glBindFramebuffer:targetwasGL_READ_FRAMEBUFFER_ANGLEGL_INVALID_ENUM:glBindFramebuffer:targetwasGL_READ_FRAMEBUFFER_ANGLEWebGL:CONTEXT_LOST_WEBGL:loseContext:contextlost当我尝试使用最大值的0.7

javascript - 如何检测webgl中的碰撞?

如何在不使用three.js等库的情况下检测webgl中的碰撞? 最佳答案 Howtodetectcollisioninwebgl你不知道。WebGL和OpenGL一样只用于绘图。它不管理场景,它没有“对象”或诸如碰撞之类的高级事物的概念。一切都与点、线、三Angular形和着色器有关。任何与场景管理或碰撞相关的事情都在WebGL(和OpenGL)的范围之外。 关于javascript-如何检测webgl中的碰撞?,我们在StackOverflow上找到一个类似的问题:

javascript - WebGL:尽管使用相同的代码,但一切都很模糊

刚开始使用WebGL,尝试绘制一些基本线条,甚至不是多边形。我找到了几个示例,将它们复制粘贴到本地并从Firefox中运行它们,它们看起来不错:锐利、清晰的边缘。然后,我创建了自己的项目,重构了(糟糕的!)samle代码,使用RequireJS加载等,示例仍然有效,但现在我的边/点/线都是模糊的。就像一些糟糕的抗锯齿设置把一切都搞砸了。我尝试了所有方法,起初我的代码看起来有些不同(尽管功能相同,恕我直言),然后我进行了更多重构以使其看起来与示例几乎相同,但我仍然看到模糊的线条。我做错了什么?示例代码:http://jsfiddle.net/6QCNR/示例代码的实时工作版本:http:

javascript - 在 WebGL 中从 Float32Array 到 Uint16Array 的转换

我有Float32Array纹理,可以通过WebGL正确显示。但是,当我尝试将它们转换为Uint16Array时,问题出现了。这是我的转换部分。var_floatToHalfFloat=function(input,offset){varlargestHalf=Math.pow(2,30-15)*(1+1023/1024);varm=newArrayBuffer(4);varn=newFloat32Array(m);varo=newUint32Array(m);varf=0.0;for(vari=input.length-1-offset;i>=0;i--){n[0]=input[i]