AFrame - 片段着色器中的 sampler3D答案

【问题标题】：AFrame - sampler3D in fragment shaderAFrame - 片段着色器中的 sampler3D
【发布时间】：2019-11-16 19:08:46
【问题描述】：

aframe 支持 webgl2 吗？我正在尝试使用

precision mediump sampler3D

在片段着色器中，我得到了这个错误：

THREE.WebGLShader: gl.getShaderInfoLog() fragment ERROR: 0:106: 'sampler3D' : Illegal use of reserved word
ERROR: 0:106: 'sampler3D' : syntax error

我阅读默认threejs支持webgl1，我必须在html中添加一个脚本标签才能支持webgl2。

<script src="/path/to/WebGL.js"></script>

另外，我尝试在文件开头添加着色器版本，但随后显示：

'version' : #version directive must occur before anything else, except for comments and white space

有没有办法在框架中做到这一点？

【问题讨论】：

标签： three.js webgl aframe fragment-shader

【解决方案1】：

好的，我成功了（至少这是一个里程碑）。

问题是 webgl 上下文 Aframe 用它来初始化场景。默认情况下它是 webgl，而不是 webgl2。保留字“sampler3D”仅在 webgl2 中可用，这就是我收到错误的原因。我不得不克隆 aframe 存储库，在文件 src\core\scene\a-scene.js 中修改方法 setupCanvas 并添加对 webgl2 的支持：

canvasEl = document.createElement('canvas');
var contextEl = canvasEl.getContext( 'webgl2' );
sceneEl.context = contextEl;

并在 setupRenderer() 方法中添加属性：

context: this.context,

到 rendererConfig 映射。

这使得我在我的着色器上运行了我的“precision mediump sampler3D”行。

【讨论】：