jam*_*her 2 html5 canvas webgl fragment-shader
我有一个<canvas>由外部库写入的元素。我希望对此画布应用“后期制作”效果:我想(r,g,b,a) -> (r,g,b,a)在每个函数最终显示之前在每个像素上映射一个函数。
我知道外部库将写入从<canvas>元素获取的2D上下文。我也知道我要的转换是“像素着色器”或“片段着色器”。我知道我需要一个webgl上下文来应用这样的着色器。这个答案告诉我,画布不能同时具有多个上下文,因此我不确定这种方法是否可行。
我考虑的另一种方法是将画布的输出捕获为流,并在应用了转换的情况下将其写入新画布。但是,此功能仅在尖端的Firefox中存在。
是否可以将片段着色器应用于画布输出?如果是这样,怎么办?
您可以将2D画布复制到WebGL纹理,然后使用您设计的任何片段着色器将该纹理渲染到WebGL画布。
关于使用画布作为纹理的源数据的堆栈溢出有很多示例
如何在webgl中获取纹理?没有Canvas.toDataUrl()
| 归档时间: |
|
| 查看次数: |
5449 次 |
| 最近记录: |