webgl中RenderTexture的抗锯齿的解决办法
webgl1.0中仅对canvas的抗锯齿的功能,对framebuffer都没有,更不谈自己创建的RenderTexture了。好在webgl2.0中增加了renderbufferStorageMultisample这个函数让在自己的RenderTexture中实现抗锯齿有了可以实现的可能。
大致思路,第一步:创建一个framebuffer和texture,调用framebufferTexture2D将二者绑定在一起。另创建一个framebuffer和renderbuffer,调用renderbufferStorageMultisample将二者绑定在一起,同时指定采样数,就是用来抗锯齿。代码如下:
创建RTT:
this._webGLTexture = this._gl.createTexture();
bindTexture(this._gl, this._webGLTexture);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
gl.texImage2D(gl.TEXTURE_2D, 0, this._gl.RGBA8, width, height, 0, this._gl.RGBA, this._gl.UNSIGNED_BYTE, null);
var framebuffer = gl.createFramebuffer();
this._framebuffer = framebuffer;
【webgl中RenderTexture的抗锯齿的解决办法】this._gl.bindFramebuffer(t
推荐阅读
- 热闹中的孤独
- Shell-Bash变量与运算符
- JS中的各种宽高度定义及其应用
- 2021-02-17|2021-02-17 小儿按摩膻中穴-舒缓咳嗽
- 深入理解Go之generate
- 异地恋中,逐渐适应一个人到底意味着什么()
- 我眼中的佛系经纪人
- 《魔法科高中的劣等生》第26卷(Invasion篇)发售
- “成长”读书社群招募
- 2020-04-07vue中Axios的封装和API接口的管理