CODEWITHSUNDEEP
webgl
Chong Lip Phang
Chong Lip Phang

Reputation: 9279

How to perform Mipmapping in WebGL?

I am learning WebGL and reading the book 'WebGL Programming Guide'. However, the book has omitted the topic on texture mipmapping. I tried to search the official OpenGL ES website but could not seem to get an answer to my question. Neither has anyone asked a similar question in StackOverflow.

Could someone show me, from the start to the end, how to perform texture mipmapping in WebGL?

Upvotes: 6

Views: 9773

Answers (1)

Tommy
Tommy

Reputation: 100632

In WebGL, you can upload mip maps manually — that's what the level parameter is in gl.texImage2D — or you can just upload level 0 and then use gl.generateMipmap to have them generated for you.

Once your mip maps are generated, use gl.texParameteri to set a gl.TEXTURE_MIN_FILTER of gl.NEAREST_MIPMAP_LINEAR (the default value), gl.NEAREST_MIPMAP_NEAREST, gl.LINEAR_MIPMAP_NEAREST or gl.LINEAR_MIPMAP_LINEAR.

Mip mapping should then be used to sample that texture.

My understanding is that it should be as simple as using gl.generateMipmap(gl.TEXTURE_2D) and e.g. gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST_MIPMAP_LINEAR).

Upvotes: 11

Related Questions