Webgl着色器调试器，变量检查 [英] Webgl shader debugger, variable inspection

问题描述

我正在寻找一个JavaScript，它可以调试WebGL着色器到单行/可变级别. 因此应该可以在每一行上中断并检查每个变量的值.

I am looking for a javascript which allows me to debug a WebGL shader down to the single line / variable level. So it should be possible break on every line and inspect the value of every variable.

这可以通过检测完成(解析着色器，生成一个着色器，该着色器输出所请求的变量，针对当前上下文执行此着色器并将输出返回给用户)

This can be done by instrumentation (parsing the shader, generating a shader which outputs the requested variable, execute this shader against the current context and returns the ouput to the user)

类似于glslDevil( http://www.vis.uni-stuttgart.de/glsldevil/)用于OpenGL.

It is similar to what glslDevil (http://www.vis.uni-stuttgart.de/glsldevil/) does for OpenGL.

有人知道这种WebGL工具是否存在吗?

Does anyone know if such a tool for WebGL exists ?

推荐答案

Firefox(至少为 v38 )具有用于WebGL GLSL着色器的调试面板.您可以编辑它们并快速重新编译它们以进行调试.我不认为它允许在单独的行中使用断点.

Firefox, at at least v38, has a debugging panel for WebGL GLSL shaders. You are able to edit and quickly recompile them for debugging purposes. I don't believe it allows for breakpoints in individual lines though.

您可以通过齿轮面板启用它:

You can enable it through the gear panel:

然后在着色器编辑器"面板中使用它

And then use it in the Shader Editor panel

这篇关于Webgl着色器调试器，变量检查的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！