Tag: webgl

“精度中等浮动”是什么意思？: 在learnwebgl tutorial1中，我在片段着色器中发现了一条有趣的线条。 precision mediump float; 我在这里find一篇关于它的文章，但是我还是不明白这是什么意思？如果我删除这条线，没有任何改变。一切都是一样的。那么precision mediump float是什么意思？

Three.js检测webgl支持并回退到常规canvas: 任何使用three.js的人都可以告诉我它是否有可能检测到webgl支持，如果不存在，可以回退到标准的Canvas呈现器吗？

GLSL编辑工具: 我正在寻找一些与GLSL合作的工具。我想在WebGL应用程序中使用着色器进行实验，所以我正在寻找的就像RenderMonkey。据我所知 – RenderMonkey不再支持，所以必须有一些其他的工具，把它的地方。如果我能做RM这样的“效果组合”和原始的GLSL代码开发，那么最好的办法是。

WebGL / GLSL – ShaderToy如何工作？: 最近，我一直在围绕着Shadertoy – https://www.shadertoy.com/ ，努力学习更多关于OpenGL和GLSL的知识。从我目前所了解的情况来看，OpenGL用户首先必须准备好要使用的所有几何graphics，并configurationOpenGL服务器（光源数量，纹理存储等）。一旦完成，用户必须在OpenGL程序编译之前至less提供一个顶点着色器程序和一个片段着色器程序。但是，当我查看Shadertoy上的代码示例时，我只能看到一个着色器程序，并且大部分使用的几何graphics似乎直接写入GLSL代码。这是如何运作的？我的猜测是顶点着色器已经预先准备好了，可编辑/采样着色器只是一个片段着色器。但是这并不能解释一些更复杂的例子中的几何。任何人都可以解释Shadertoy是如何工作的？

在WebGL中，属性，统一和variables之间有什么区别？: 在比较这些不同的types时，我能想到一个比喻，或者说这些东西是如何工作的？另外，统一matrix是什么意思？

如何检测页面何时退出全屏？: 我正在用Three.js创build一个3D多人游戏，玩家可以join各种现有的游戏。一旦“播放”被点击，渲染器被追加到页面和全屏。这很好，但问题是，当我退出全屏，它仍然保持附加。我想删除它，但我不知道什么时候！所以，基本上，我正在寻找一个事件，说“这个元素退出全屏”。这是我如何将渲染器追加到页面： container = document.getElementById('container'); document.body.appendChild(container); var renderer = new THREE.WebGLRenderer({antialias: true}); renderer.setSize( WIDTH, HEIGHT); container.appendChild( renderer.domElement ); 这如果我如何全屏显示它： THREEx.FullScreen.request(container); renderer.setSize(screen.width, screen.height); 另外，有没有办法阻止这个令人讨厌的标题出现时，只要有人点他的鼠标到页面的顶部？而且，我想我可以防止在Firefox和Chrome中使用preventDefault从事全屏操作（退出全屏模式）？而且，还有谁知道为什么Firefox在3D渲染方面比Chrome慢得多？我的意思是，我正在使用WebGL，这意味着正在使用GPU！编辑： “fullscreenchange”事件确实被解雇了，但是在不同的浏览器下它有不同的名字。例如，在Chrome上称为“webkitfullscreenchange”，在Firefox上则为“mozfullscreenchange”。

将WebGL应用程序部署为本机iOS或Android应用程序？: 有没有人知道你可以部署一个WebGL应用程序作为本地的iOS或Android应用程序的方式吗？商业中间件是可以接受的，但是一个开放的项目是可取的。谢谢。

Javascripttypes的数组和字节顺序: 我正在使用WebGL来渲染二进制编码的网格文件。二进制文件是以big-endian格式写出来的（我可以通过在hex编辑器中打开文件或使用fiddler查看networkingstream量来validation这一点）。当我尝试使用Float32Array或Int32Array读取二进制响应时，二进制被解释为little-endian，我的值是错误的： // Interpret first 32bits in buffer as an int var wrongValue = new Int32Array(binaryArrayBuffer)[0]; 我找不到在http://www.khronos.org/registry/typedarray/specs/latest/中的任何types数组的默认sorting的引用，所以我想知道什么是交易？我应该假设所有的二进制数据在使用types数组读取时应该是小尾数？为了解决这个问题，我可以使用一个DataView对象（在前面的链接中讨论）并且调用： // Interpret first 32bits in buffer as an int var correctValue = new DataView(binaryArrayBuffer).getInt32(0); DataView函数（如“getInt32”）默认读取big-endian值。（注意：我已经使用Google Chrome 15和Firefox 8进行testing，它们的行为方式都是一样的）

优化重叠矩形的绘制: 我有大量的矩形，有些与其他的重叠; 每个矩形都有一个绝对的z次序和一个颜色。（每个“矩形”实际上是粒子效果，网格或纹理的轴alignment的边界框，并且可能是半透明的，但只要不尝试挑选其他矩形，就更容易抽象地思考彩色矩形，所以我会用在问题描述:) 改变“颜色”的成本相当高; 其绘制两个蓝色矩形比绘制两个不同颜色的矩形要快得多。甚至不在屏幕上绘制矩形的成本也相当高，应该避免。如果两个矩形不重叠，它们相对于彼此的顺序并不重要。只有它们重叠时，z顺序才是重要的。例如： 1（红色）和4（红色）可以一起绘制。 2（蓝色）和5（蓝色）也可以绘制在一起，如3（绿色）和7（绿色）。但是8（红色）必须在6（蓝色）之后绘制。所以要么我们把所有的三个红色画在一起，画两个蓝色，要么把所有的蓝色画在一起，画两个红色。而且有些矩形可能会偶尔移动。（不是所有的人都知道，有些矩形是静止的，有些则是已知的。）我将在JavaScript / webGL中绘制这个场景。我怎样才能以合理的顺序绘制矩形，以最大限度地减less颜色变化，与JavaScript剔除代码的良好折衷与让GPU剔除？（只是算出哪些矩形重叠，哪些是可见的，是昂贵的，我有一个基本的四叉树，这很快就绘制了我的场景（相比之下，只是发射整个场景的绘制操作）;现在的问题是如何最小化OpenGL状态更改并尽可能地连接属性数组）更新我创build了一个非常简单的testing应用程序来说明问题，并作为解决scheme演示的基础： http : //williame.github.com/opt_rects/ 源代码在github上，很容易分叉： https ： //github.com/williame/opt_rects 事实certificate，很难做出一个足够的状态变化的小testing应用程序来真正重现我在整场游戏中看到的问题。在某些时候，你必须把它看作是一种状态变化足够昂贵的情况。同样重要的是如何加快空间索引（演示中的四叉树）和整体方法。

调用glDisableVertexAttribArray（）是否很重要？: 我并不完全清楚启用顶点属性数组的范围。我有几个不同的着色器程序，具有不同数量的顶点属性。 glEnableVertexAttribArray局部调用着色器程序还是全局？现在我在创build着色器程序时启用了顶点attrib数组，并且从不禁用它们，而且似乎都可以工作，但好像我可能应该在绘制调用之前/之后启用/禁用它们。这有没有影响？（我正在使用WebGL，所以我们真的在谈论gl.enableVertexAttribArray和gl.disableVertexAttribArray 。我还会注意到，这本橙色的书， OpenGL Shading Language对这些调用没有任何意义。）