PDA

View Full Version : FXAA with OpenGL ES 2.0



berserker.devel
08-31-2011, 05:14 AM
Hi, I'm new around here and I'm not an OpenGL guru since I just started learning OpenGL ES 2.0 on Android (so please be patient :) )
One of the biggest problem I'm having with OpenGL ES is the lack of native antialias support (please correct me if I'm wrong), here it is a sample of my bad looking application (it's a desktop application running OpenGL ES 2.0 in "emulation mode" thanks to a middleware API).

No antialias
http://img690.imageshack.us/img690/1055/noaa.png (http://imageshack.us/photo/my-images/690/noaa.png/)

I have read many articles about antialias (some oriented to "specif tasks" like this one (http://answers.oreilly.com/topic/1669-how-to-render-anti-aliased-lines-with-textures-in-ios-4/)), but I'm looking for a generic and easy to use implementation.
The two only options available for my requirements, as far as I know, are: Supersampling Postprocessing shaders like FXAA, MLAA etc...
Supersampling was easy thanks to the library I'm using:

Supersampling 1.5x
http://img829.imageshack.us/img829/5369/supersampling15x.png (http://imageshack.us/photo/my-images/829/supersampling15x.png/)

Supersampling 2x
http://img847.imageshack.us/img847/3277/supersampling2x.png (http://imageshack.us/photo/my-images/847/supersampling2x.png/)

Even if supersampling works great and have a good looking result (on the PC), soon I discovered that has very bad performance on "mobile" side and I started looking at the second option :)

FXAA 3.11
http://img831.imageshack.us/img831/646/fxaa.png (http://imageshack.us/photo/my-images/831/fxaa.png/)

FXAA (which is known to be fast) has the best looking result but I'm still not able to make it works on my phone (it works on PC but not on the phone due to a shader error) and that's why I'm writing here today. As I wrote above, my experience with shaders is very limited and I'm not able to track the "real" problem.
Can anyone tell me if FXAA can run in OpenGL ES 2.0? If not, is there any chance to use something similar which is supported for that target? Maybe MLAA?

Please help, thanks!

ZbuffeR
08-31-2011, 07:58 AM
And what is the "shader error" you get ?

berserker.devel
09-01-2011, 03:30 AM
And what is the "shader error" you get ?
Sorry for being "too generic" there but my original intent was to understand if FXAA/MLAA/etc are supported on OpenGL ES 2.0.
Anyway I have problems in getting a detailed error message when I run the application on my device (no probs on PC): the call to GL_COMPILE_STATUS gives me a return value of 0 which means an error, but GL_INFO_LOG_LENGTH always return 0 and I cannot track the message. After lots of #ifdef in the fragment shader, I suspect that the problem is in a call to "texture2DLod" that is probably not supported. Anyway, as I wrote above, I'm interested in understating if a post processing filter for AA is in general supported in OpenGL ES 2.0.

I forgot to post the (adapted) shader code:

Vertex shader (http://pastebin.com/zyC6bQBr)
Fragment shader (http://pastebin.com/wNaaMfWt)

Hope it helps :)

ZbuffeR
09-01-2011, 04:29 AM
The most useful link I found is this one:
http://www.khronos.org/webgl/wiki/WebGL_and_OpenGL_Differences
this confirms that no *Lod is supported in fragment shader.


EDIT: it seem you can get away without the lod, in this case :


#define FxaaTexTop(t, p) texture2DLod(t, p, 0.0)

This is the base level only, so it can be emulated with a non-mipmapped texture access :


#define FxaaTexTop(t, p) texture2D(t, p)

berserker.devel
09-01-2011, 05:50 AM
Thanks again ZbuffeR for your suggestions, I'll have a try and I'll post my results.
Am I the only one interested in this :) !?

berserker.devel
09-01-2011, 08:04 AM
And here it is :) (directly taken from my Nexus One)

No antialias
http://img707.imageshack.us/img707/5729/device20110901165023.png (http://imageshack.us/photo/my-images/707/device20110901165023.png/)

FXAA 3.11 (low settings)
http://img163.imageshack.us/img163/4953/device20110901165120.png (http://imageshack.us/photo/my-images/163/device20110901165120.png/)

As usual, it was very hard to debug since on error I got no message from OpenGL...As suggested by ZbuffeR, all references to texture2DLod has been changed to texture2D and I made some small changes in the code shared in my last post too.
Btw I got a very very bad frame rate (1fps vs ~30fps :D :D ), could it be caused by swapping texture2DLod with texture2D? I'm really noob with this...any other suggestion to increase the fps?
Thanks anyway for your help ;)

ZbuffeR
09-01-2011, 10:05 AM
Read http://www.opengl.org/wiki/Performance
You can try commenting out various parts of the shader to see how it improves performance, but my understanding is that your hardware is not powerful enough period.

Speaking of hardware, what are your specs ? By any chance, can you run it on a different phone ?

berserker.devel
09-02-2011, 01:07 AM
Thanks for the link, I'll keep testing the shader.
About specs, I know that my phone is not a "recent" model (details here (http://en.wikipedia.org/wiki/Nexus_One)), anyway I should be able to make some tests on other devices.
Thanks again for the support ;)

ZbuffeR
09-02-2011, 03:05 AM
It appears to have an andreno 200, which does not seem very fast according to this :
http://smartphonebenchmarks.com/forum/in...-to-other-gpus/ (http://smartphonebenchmarks.com/forum/index.php?/topic/61-what-is-adreno-205-and-how-does-it-compare-to-other-gpus/)

berserker.devel
09-02-2011, 03:20 AM
It appears to have an andreno 200, which does not seem very fast according to this :
http://smartphonebenchmarks.com/forum/in...-to-other-gpus/ (http://smartphonebenchmarks.com/forum/index.php?/topic/61-what-is-adreno-205-and-how-does-it-compare-to-other-gpus/)
Yes that's right: are you telling me that there is no chance to have a good frame rate on my device? I cannot exclude devices with the same specs for my "target". Can you suggest something better for my purpose?
Thanks as usual :)

ZbuffeR
09-02-2011, 04:38 AM
Do not use polygons, use textured quads with transparent edge, it will be much faster and still be nicely filtered.
Less generic that FXAA of course, but you don't have a lot of choice for this hardware.

EDIT : can you use GL_POLYGON_SMOOTH on GL ES 2.0 ? It could be worth a try. Here are the calls needed to enable this feature on regular GL (modern computer cards no longer implement it, only GL_LINE_SMOOTH seem to work) :

glEnable(GL_BLEND);
glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);
glHint(GL_POLYGON_SMOOTH, GL_NICEST);
glEnable(GL_POLYGON_SMOOTH);

berserker.devel
09-02-2011, 05:26 AM
EDIT : can you use GL_POLYGON_SMOOTH on GL ES 2.0 ? It could be worth a try. Here are the calls needed to enable this feature on regular GL (modern computer cards no longer implement it, only GL_LINE_SMOOTH seem to work) :

glEnable(GL_BLEND);
glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA);
glHint(GL_POLYGON_SMOOTH, GL_NICEST);
glEnable(GL_POLYGON_SMOOTH);
GL_POLYGON_SMOOTH seems to be not available here.
GL_LINE_SMOOTH does work, but it's out of my scope (I hope to make more tests on other devices).

ZbuffeR
09-02-2011, 06:48 AM
Then blended texture :
http://homepage.mac.com/arekkusu/bugs/invariance/TexAA.html
Or blended colors :
http://stackoverflow.com/questions/1813035/opengl-es-iphone-drawing-anti-aliased-lines#1983730

berserker.devel
09-02-2011, 06:56 AM
Then blended texture :
http://homepage.mac.com/arekkusu/bugs/invariance/TexAA.html
Or blended colors :
http://stackoverflow.com/questions/1813035/opengl-es-iphone-drawing-anti-aliased-lines#1983730
Yes, I had a look at those links in the past but the simplicity (I mean easy to use) and quality result of a FXAA is very attractive :)
As I wrote in the first post, my original idea was finding a "generic" way for antialias in OpenGL ES.
Thanks anyway for the suggestion ;)