javascript - WEBGL - 如何显示图像？

Question

我希望只是使用 WEBGL 在画布上以 x 和 y 坐标显示图像，但不知道该怎么做。我需要包括着色器和所有这些东西吗？我见过显示图像的代码，但它们非常笨重。我不想使用框架。如果可能的话，您能否评论并解释重要部分的作用？我将使用 WEBGL 进行基于 2d 瓷砖的游戏。

感谢您的时间

Answer 1

是的，您需要一个顶点和片段着色器，但它们可以相对简单。我建议从 Mozilla 示例开始，正如 Ido 所建议的那样，在你运行它之后，删除 3D 方面。特别是，您不需要 uMVPMatrix 和 uPmatrix，并且您的坐标数组可以是二维的。对于顶点着色器，这意味着：

attribute vec3 aVertexPosition;  
attribute vec2 aTextureCoord;  

varying highp vec2 vTextureCoord;  

void main(void) {  
  gl_Position = vec4(aVertexPosition, 0.0, 1.0);  
  vTextureCoord = aTextureCoord;  
}