使用sampler3D时在WebGL 2.0 GLSL中遇到语法错误

时间:2016-05-31 08:34:16

标签: javascript firefox glsl webgl webgl2

我正在尝试使用WebGL 2.0在浏览器中渲染3D医疗数据。

WebGL 2.0现在支持AFAIK 3D纹理。

texImage3D()是一个公认的函数调用。

我正在编写一个片段着色器并声明一个统一的采样器:

uniform sampler3D samp;

当我在Firefox上运行它时,我收到一个错误:

  

未捕获的异常:着色器编译错误:错误:0:19:'sampler3D':    非法使用保留字ERROR:0:19:'sampler3D':语法错误

当我使用sampler2D时工作得很好(虽然不能解决我的目的)。

请问有谁可以指出我在这里做错了什么?

还不支持sampler3D吗? 但在这种情况下,如何使用texImage3D()加载任何纹理?

1 个答案:

答案 0 :(得分:6)

您是否更改了需要更改的所有内容以使用sampler3D等WebGL 2.0功能?

要使用sampler3D,您需要添加

#version 300 es

到着色器的顶部。 它是第一线,没有白色的前线

请注意,GLSL 1.0中的GLSL 3.00还有许多其他更改

在这里测试

"use strict";

const vs = `#version 300 es

in vec4 position;

void main() {
  gl_Position = position;
}
`;

const fs = `#version 300 es
precision mediump float;
precision lowp sampler3D;

uniform sampler3D u_someTexture;

out vec4 theColor;

void main() {
  theColor = texture(u_someTexture, vec3(0,0,0));
}
`;

function main() {
  var m4 = twgl.m4;
  var gl = twgl.getContext(document.createElement("canvas"));
  log("using: " + gl.getParameter(gl.VERSION));  
  if (!twgl.isWebGL2(gl)) {
    log("Sorry, this example requires WebGL 2.0");  
    return;
  }

  var programInfo = twgl.createProgramInfo(gl, [vs, fs], (err) => {
    log("could not compile shader: " + err);
  });
  if (programInfo) {
    log("compiled shader with sampler3D");
  }

}
main();

function log() {
  var elem = document.createElement("pre");
  elem.appendChild(document.createTextNode(Array.prototype.join.call(arguments, " ")));
  document.body.appendChild(elem);
}
<script src="https://twgljs.org/dist/twgl-full.min.js"></script>