User avatar
tipam
Posts: 96
Joined: Fri Dec 30, 2011 1:32 pm
Contact: Website

RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Sat Jul 27, 2019 5:59 pm

Hi,

I've just written a small app that will render over 100+ OpenGL ES 3.0 shaders (pinched from ShaderToy.com) to give an idea of what can be done with the RPi 4 GPU.

Link: http://www.skillmanmedia.com/ShaderToyRPi4.zip

You will need to install the SDL2 libraries from a terminal window and reserve 128MB GPU mem ...

Code: Select all

sudo apt-get install libsdl2-dev
sudo apt-get install libsdl2-image-dev
sudo apt-get install libsdl2-ttf-dev
sudo apt-get install libsdl2-mixer-dev
You should be able to dbl-click the ShaderToy executable after unzipping the folder to try it out.
(You will need to set permissions first by selecting ShaderToy, right-click 'File Properties->Permissions->Execute' to 'Anyone')

Use the SPACEBAR to jump to the next shader and ESCAPE to exit.
There are some shaders that allow you to use the mouse (navigation/rotate etc..)

The 'options.txt' file allows you to change a few obvious settings.

Note - this will ONLY work on the Raspberry Pi 4!

Please let me know if you have any problems.

Have fun! :D
Raspberry Pi == small computer == big dreams

pik33
Posts: 173
Joined: Thu Sep 10, 2015 4:26 pm

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Sun Jul 28, 2019 4:58 pm

Downloaded, tested, it works. The only problem I noticed is unresponsible X when playing with "heavy" shaders.

jamesh
Raspberry Pi Engineer & Forum Moderator
Raspberry Pi Engineer & Forum Moderator
Posts: 23309
Joined: Sat Jul 30, 2011 7:41 pm

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Sun Jul 28, 2019 5:29 pm

pik33 wrote:
Sun Jul 28, 2019 4:58 pm
Downloaded, tested, it works. The only problem I noticed is unresponsible X when playing with "heavy" shaders.
Not wholly surprising - some of those shaders requires a HUGE amount of GPU processing, and X rendering requires...the GPU.
Principal Software Engineer at Raspberry Pi (Trading) Ltd.
Contrary to popular belief, humorous signatures are allowed. Here's an example...
"My grief counseller just died, luckily, he was so good, I didn't care."

User avatar
tipam
Posts: 96
Joined: Fri Dec 30, 2011 1:32 pm
Contact: Website

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Sun Jul 28, 2019 7:17 pm

jamesh wrote:
Sun Jul 28, 2019 5:29 pm
pik33 wrote:
Sun Jul 28, 2019 4:58 pm
Downloaded, tested, it works. The only problem I noticed is unresponsible X when playing with "heavy" shaders.
Not wholly surprising - some of those shaders requires a HUGE amount of GPU processing, and X rendering requires...the GPU.
You're right - but I'm still quite surprised the humble Pi4 can handle those shaders!

I just wanted to see how far the Pi4 could be pushed ... some of the shaders could be used for static renders / fractal texture generation for example. And some are still pretty quick and usable.
Raspberry Pi == small computer == big dreams

User avatar
Gavinmc42
Posts: 3605
Joined: Wed Aug 28, 2013 3:31 am

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Mon Jul 29, 2019 2:50 am

I also needed this one.
sudo apt-get install libsdl2-image-dev

Nice shadertoy demos.
I started them up with 64MB, was not too bad.
Apart from the initial load no CPU usage at all.

Wonder what can be done with 4 x A72's and the VC6.
3GB for the Arm's, 1GB for the VC6?
Better get a 4B4 first.

SDL2 is just working now?
I suppose that means I have to add it to my list of things to learn :)

I like that I can edit the options file and only display some of them.
I am interested in water effects at the moment.
This will work to test any shader files?
I'm dancing on Rainbows.
Raspberries are not Apples or Oranges

User avatar
PeterO
Posts: 4939
Joined: Sun Jul 22, 2012 4:14 pm

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Mon Jul 29, 2019 7:01 am

Gavinmc42 wrote:
Mon Jul 29, 2019 2:50 am
Wonder what can be done with 4 x A72's and the VC6.
3GB for the Arm's, 1GB for the VC6?
Better get a 4B4 first.
VC6 doesn't need lots of memory to be preallocated because it has it's own MMU so can use "normal" memory. ISTR only some camera related hardware still needs the preallocated memory,

PeterO
Discoverer of the PI2 XENON DEATH FLASH!
Interests: C,Python,PIC,Electronics,Ham Radio (G0DZB),1960s British Computers.
"The primary requirement (as we've always seen in your examples) is that the code is readable. " Dougie Lawson

User avatar
Gavinmc42
Posts: 3605
Joined: Wed Aug 28, 2013 3:31 am

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Mon Jul 29, 2019 7:26 am

Tim's shadertoy is fun.

Povray works on Pi4 and can make nice sky.
http://www.f-lohmueller.de/pov_tut/backgrnd/p_sky9.htm

Mix the cheapwater shader with a sky png ;)

I know from Gentoo64 16MB, ie the minimum was used for the GPU.
Not sure why Buster defaulted to 64MB.
I'm dancing on Rainbows.
Raspberries are not Apples or Oranges

User avatar
Gavinmc42
Posts: 3605
Joined: Wed Aug 28, 2013 3:31 am

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Mon Jul 29, 2019 7:29 am

Ok, set it to 16MB and it still seems fine.
Now for further testing.
I'm dancing on Rainbows.
Raspberries are not Apples or Oranges

jamesh
Raspberry Pi Engineer & Forum Moderator
Raspberry Pi Engineer & Forum Moderator
Posts: 23309
Joined: Sat Jul 30, 2011 7:41 pm

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Mon Jul 29, 2019 8:45 am

Gavinmc42 wrote:
Mon Jul 29, 2019 7:26 am
Not sure why Buster defaulted to 64MB.
Camera and codec support requires more than 16MB. 64MB is about right for those.
Principal Software Engineer at Raspberry Pi (Trading) Ltd.
Contrary to popular belief, humorous signatures are allowed. Here's an example...
"My grief counseller just died, luckily, he was so good, I didn't care."

User avatar
Gavinmc42
Posts: 3605
Joined: Wed Aug 28, 2013 3:31 am

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Mon Jul 29, 2019 8:57 am

Camera and codec support requires more than 16MB. 64MB is about right for those.
Ah, codec is the h264 hardware one? VLC uses it?
If I don't use camera and codec then 16MB should be ok?
Stick with just music while coding?
I'm dancing on Rainbows.
Raspberries are not Apples or Oranges

6by9
Raspberry Pi Engineer & Forum Moderator
Raspberry Pi Engineer & Forum Moderator
Posts: 7124
Joined: Wed Dec 04, 2013 11:27 am
Location: ZZ9 Plural Z Alpha, aka just outside Cambridge.

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Mon Jul 29, 2019 9:02 am

Gavinmc42 wrote:
Mon Jul 29, 2019 8:57 am
Camera and codec support requires more than 16MB. 64MB is about right for those.
Ah, codec is the h264 hardware one? VLC uses it?
If I don't use camera and codec then 16MB should be ok?
Stick with just music while coding?
Hevc is also using the same mechanism to allocate buffers, mainly as it was a simple route to do it. As and when we manage to shift to v4l2 then those will be cma allocations too.
Software Engineer at Raspberry Pi Trading. Views expressed are still personal views.
I'm not interested in doing contracts for bespoke functionality - please don't ask.

User avatar
tipam
Posts: 96
Joined: Fri Dec 30, 2011 1:32 pm
Contact: Website

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Tue Jul 30, 2019 11:09 pm

... Added a fix to ShaderToy; iResolution should be a vec3 (not vec2) in a shader file. Shaders updated accordingly plus there's a few more nice shaders to play around with!

Here's the link: http://www.skillmanmedia.com/ShaderToyRPi4b.zip
Raspberry Pi == small computer == big dreams

User avatar
Gavinmc42
Posts: 3605
Joined: Wed Aug 28, 2013 3:31 am

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Wed Jul 31, 2019 12:08 am

Thanks Tim.
Playing with these examples has been a lot of fun.
They show that shaders can do lots to add to the visual effects.
I have no idea how the shader maths works yet but it is easy to modify and see the results.

It does not matter how many books I read, none makes sense till I see code working.
This helps filling that big hole between a RGB triangle/cube and a full 3D rendered model.
I'm dancing on Rainbows.
Raspberries are not Apples or Oranges

User avatar
Gavinmc42
Posts: 3605
Joined: Wed Aug 28, 2013 3:31 am

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Wed Jul 31, 2019 8:31 am

Lots of cool shaders on that site.
Doing a crash course on learning what they are.
They seem to be some sort of magical incantations using maths.

I now want to get Minecraft working just so I can put this on it.
http://shadersmods.com/sonic-ethers-unb ... aders-mod/
I'm dancing on Rainbows.
Raspberries are not Apples or Oranges

User avatar
tipam
Posts: 96
Joined: Fri Dec 30, 2011 1:32 pm
Contact: Website

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Wed Jul 31, 2019 6:41 pm

Gavinmc42 wrote:
Wed Jul 31, 2019 12:08 am
.
I have no idea how the shader maths works yet but it is easy to modify and see the results.
You're right! ... some of those shaders are insane! ... If you have a PC with an NVidia/AMD graphics card you'll find some crazy shaders ..

For example https://www.shadertoy.com/view/MsGGDK is a mini movie, battle scene with realistic effects, geometry and a computer generated sound track lasting just over 2 mins ... in just 330 lines of shader code (minus sound code)!

I can't imagine how some people visualize maths and coding like this - they must from another planet :mrgreen:
Raspberry Pi == small computer == big dreams

User avatar
Gavinmc42
Posts: 3605
Joined: Wed Aug 28, 2013 3:31 am

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Thu Aug 01, 2019 2:39 am

Any sufficiently advanced technology is indistinguishable from magic. Arthur C. Clarke
Yep, these guys are the Harry Potters of the GPU universe.
I want to get a 4K screen and stick it on the roof as a fake skylight and just stare at Clouds2D all day.

First I need to figure out how it works so I can tune it faster on the Pi4.
I can slow it done a little but still jerky at full screen on a 1280x1024.
CPU usage is easy to measure, how to measure GPU usage?

How to find out if it is using 16bit or 32bit floats?
Can we double the speed by using the new 16bit floats?

Some way to spread the processing to the CPU/NEON.
It seems the noise code takes some processing, could that be CPUed?
Need to get a 4B4, precalculate a bunch of code and hold it in memory?
.. battle scene with realistic effects..
Landscapes with water, trees and clouds in a few tens of lines of code :o
It has to be magic, secret formulas passed around by a cabal of coders?

Thanks Tim.
Here is another 10years of learning some serious brain stretching maths for me :lol:
Some guys spend a lot of time on Fibonacci, this shader stuff looks like more fun.
I'm dancing on Rainbows.
Raspberries are not Apples or Oranges

UglyMike
Posts: 31
Joined: Fri Feb 10, 2012 2:45 pm
Contact: Website

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Thu Aug 01, 2019 9:54 am

This is GREAT!! Thanks! I came to the forums to complain that chromium can't handle Shadertoy.com, but I see you already have a nice workaround! Thanks again. (Any idea WHY chromium can't handle shadertoy.com? WebGL issues? Something else?)

Now looking for other suitable alternatives to Shadertoy.com in order to see/modify fragmentshaders and to try to write some basic ones using some programs from the following list: https://alternativeto.net/software/shadertoy/

Thanks again. :P

User avatar
Gavinmc42
Posts: 3605
Joined: Wed Aug 28, 2013 3:31 am

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Thu Aug 01, 2019 10:35 am

Any idea WHY chromium can't handle shadertoy.com? WebGL issues? Something else?)
No idea, but even my work Window10 PC struggles.
I do have to cut and paste from the Windows PC into a file i can test with Tim's tool.
Probably some, lots of those shaders require serious GPU hardware.
Shaders are GPU stress testers ;)

Pi's can handle WebGL,
I tested WebGLSamples on Chromium and Firefox on Gentoo64 on a 3B+.
The Pi4 is even faster with these Samples.

Thanks for that link to alternatives.
Shadergif looks like a place to start, but I get a warning that says WebGL2 not supported. :?
http://webglsamples.org/WebGL2Samples/# ... tex_format

So maybe Pi4/Buster is not perfect yet?
I'm dancing on Rainbows.
Raspberries are not Apples or Oranges

User avatar
Gavinmc42
Posts: 3605
Joined: Wed Aug 28, 2013 3:31 am

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Fri Aug 02, 2019 5:08 am

It is the Mesa GLSL compiler that does the magic?
I have to find out if it works on the old VC4 Pi's.
https://www.x.org/wiki/Events/XDC2015/P ... mpiler.pdf

Will reading this help or confuse me?
https://github.com/mesa3d/mesa/tree/mas ... piler/glsl

GLSL code running on a Zero will be just as fast as it running on a 3B+?
I am only just starting to understand OpenGL now I need to figure out vec4 hypercubes :o
Non stop learning with these Pi's.
I'm dancing on Rainbows.
Raspberries are not Apples or Oranges

User avatar
Gavinmc42
Posts: 3605
Joined: Wed Aug 28, 2013 3:31 am

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Thu Aug 08, 2019 10:09 am

Ok Tim, how did you do it?
These run on a Pi3B+ as well, some not fast, but some ok.
I did get some thermal throttling, going to need heatsinks on my 3's ;)
I'm dancing on Rainbows.
Raspberries are not Apples or Oranges

pik33
Posts: 173
Joined: Thu Sep 10, 2015 4:26 pm

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Thu Aug 08, 2019 6:25 pm

Landscapes with water, trees and clouds in a few tens of lines of code
This is what you can do using 4096(!) bytes of code - including music:

https://www.youtube.com/watch?v=jB0vBmiTr6o

User avatar
Gavinmc42
Posts: 3605
Joined: Wed Aug 28, 2013 3:31 am

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Fri Aug 09, 2019 2:39 am

I saw this time lapse on the blog and the clouds over the Finnish Lake reminded me of the clouds2D shader.
https://www.raspberrypi.org/blog/rather ... me-lapses/

These moving sand paintings were all the rage decades ago, got one somewhere.
https://www.bing.com/images/search?q=sa ... &FORM=IGRE

So why not figure out how to do this with Pi's.
Not time lapse, just real time, nice slow calming clouds.
Seem to have collected a surplus of monitors, time to use them ;)
Use the onboard USB hub for power.

Simple enough a Zero can do it, which means OpenGLES 2.0.
But I did not think the VC4 had shaders.

So when Tim's shadertoy worked on a Pi3B+ I got confused.
I'm dancing on Rainbows.
Raspberries are not Apples or Oranges

User avatar
Paeryn
Posts: 2632
Joined: Wed Nov 23, 2011 1:10 am
Location: Sheffield, England

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Fri Aug 09, 2019 2:09 pm

Gavinmc42 wrote:
Fri Aug 09, 2019 2:39 am
Simple enough a Zero can do it, which means OpenGLES 2.0.
But I did not think the VC4 had shaders.

So when Tim's shadertoy worked on a Pi3B+ I got confused.
OpenGLES1's vertex and fragment stages are fixed-function only, OpenGL ES2's vertex and fragment stages are shader only. When running ES1 code the VC4 will be using pre-defined shaders that implement the the fixed-function stages. What gave you the impression that the VC4 didn't have shaders?
She who travels light — forgot something.

pik33
Posts: 173
Joined: Thu Sep 10, 2015 4:26 pm

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Fri Aug 09, 2019 5:53 pm

These moving sand paintings were all the rage decades ago, got one somewhere.
This still exists and works on RPi4 :)

https://dan-ball.jp/en/javagame/dust/

If this is possible using Java, then shader based sand art should be possible too

User avatar
Gavinmc42
Posts: 3605
Joined: Wed Aug 28, 2013 3:31 am

Re: RPi 4 OpenGL ES 3.0 ShaderToy to download (100+ examples)

Sat Aug 10, 2019 12:37 am

Cool demo, lots of things seem to just work on Pi4's :D
Good excuse for learning OpenGL Particle coding :D
What gave you the impression that the VC4 didn't have shaders?
In Tim's Readme it says only works on Pi4's.
It looks like mesa is smart enough to figure that out and use the VC4 driver.
Dug out the VC4 manual, not much on shaders, need the VC6 manual, not that it will make much sense.

Think I need to look at the output of the shader compilers.
So far reading all the OpenGL books is leading me to conclude shaders are even more complex than just the 3D stuff.

Been putting off learning 3D on Pi's, it has been playing with OpenGL on the Pi4 that all the pieces fell into place.
I wondered why there was nothing between triangles and cubes and full objects in OpenGLES.
There is no library like FreeGLUT for OpenGLES.

Then Tim comes along and throws shaders into the mix.
Another new world of learning.
I'm dancing on Rainbows.
Raspberries are not Apples or Oranges

Return to “OpenGLES”