WEBGL - How to display an image?

I want to just show the image on the canvas with x and y coordinates using WEBGL, but I don’t know how to do it. Do I need to turn on shaders and all that? I saw code for displaying images, but they are very bulky. I do not want to use the framework. If possible, could you comment and explain what the important sections do? I will use WEBGL for a game based on the 2nd tile.

Thank you for your time

+3
source share
1 answer

Yes, you need vertex and fragment shaders, but they can be relatively simple. I would recommend starting with the Mozilla example, as suggested by Ido, and after you run it, remove the 3D aspect. In particular, you do not need uMVPMatrix and uPmatrix, and your coordinate array may be 2D. For the vertex shader, this means:

attribute vec3 aVertexPosition;  
attribute vec2 aTextureCoord;  

varying highp vec2 vTextureCoord;  

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

All Articles