Over the past few days, I've been experimenting with WebGL, which is OpenGL from your browser. Personally, I want to build something which lets me ...
For further actions, you may consider blocking this person and/or reporting abuse
Very good, thank you.
A while a go, I have integrate these WebGL primitives from a php WordPress server.
blog.cyring.free.fr/?page_id=4496&...
blog.cyring.free.fr/?page_id=4576&...
The goal was to source coordinates and textures from the html page.
Let me know if you are interested by the source code
Hello,
This was a great great tutorial. Thank you :)
I would like to understand why you create a buffer of 500 floats ?
Where is this buffer used in the program ?
And... please write some other WebGL tutorials.
(Sorry for my english.)
So the buffer is
new Float32Array(1000);
, it actually takes 1000 floats.But since it's used to provide a
vec2
, an x,y vector, then it supports 500 sprites.The "500" is just a random number. The demo will fail if you try to add more than 500 images. If you wanted to support any number of sprites, you'd have to create a new, larger array when the original ran out of space.
Also, thanks, I'm glad you enjoyed the article!
Understood. Thank you this explanation.
By default, webgl treats colors as premultiplied.
here the "icon" image is not premultiplied. So you have to add the line
gl_FragColor.rgb *= gl_FragColor.a
if we don't, here is the result, note the white limit at the intersections of the icons
if we add this line, we see a better result :
void main() {
gl_FragColor = texture2D(spriteTexture, gl_PointCoord);
gl_FragColor.rgb *= gl_FragColor.a;
}
I'm definitely in for more OpenGL/WebGL!
excellent post, exactly what i needed, thank you a lot!