在WebGL中使用GLSL着色器的流行方式似乎是将它们嵌入到主html文件中.顶点和片段着色器嵌入在以下标记中:
<script id="shader-fs" type="x-shader/x-fragment">
Run Code Online (Sandbox Code Playgroud)
这与我在Mozilla Developer Network页面中的WebGL示例中看到的相同.
这适用于简单的应用程序,但是当你有一个带有许多着色器的复杂应用程序时,html文件会变得混乱.(我一直在编辑错误的着色器!)另外,如果你想重复使用着色器,这个方案很不方便.
所以我考虑将这些着色器放在一个单独的XML文件中,并使用XMLHttpRequest()加载它们.然后我看到其他人有同样的想法:
http://webreflection.blogspot.com/2010/09/fragment-and-vertex-shaders-my-way-to.html
我喜欢使用.c文件的建议,因为这为GLSL提供了语法高亮和其他编辑器便利.
但是上述方法的问题是(据我所知)XMLHttpRequest()在开发和测试WebGL应用程序时无法加载本地.c文件 - 即在客户端.但是在此过程中继续将其上传到服务器是很麻烦的.
因此,如果我想将着色器保留在html文件之外,那么将它们作为字符串嵌入代码中是唯一的选择吗?但这会使编写和调试变得困难......
我很感激有关在WebGL应用程序中管理多个GLSL着色器的任何建议.
问候
编辑(2011年5月5日)
由于我使用Mac进行开发,我决定启用Apache服务器,并将我的webgl代码放在http:// localhost/~username /下.这避免了在开发期间禁用文件:协议的问题.现在javascript文件加载代码在本地工作,因为使用了http:而不是file:.我以为我会把它放在这里以防万一有人发现它有用.
我使用以下代码在HTML文件中声明我的GLSL ES着色器程序:
<script id="shader-fs" type="x-shader/x-fragment">..shader-code..</script>
Run Code Online (Sandbox Code Playgroud)
正如在学习WebGL示例中看到的那样.一切正常,但我不明白为什么我应该使用脚本标签的type属性.我想知道指定"x-shader/x-fragment"值的位置.是谁... W3C,Khronos集团或浏览器开发商?有谁能够帮我?Tahnk你.