gdquest-demos / godot-3-demos

Dozens of free and open source demos for the Godot game engine, version 3. Head to the link below for newer demos for Godot 4+
https://github.com/gdquest-demos/
MIT License
1.85k stars 975 forks source link

Thick outlines in diagonal direction in outline shader #28

Closed michalove closed 5 years ago

michalove commented 6 years ago

Hi, I just watched the video on the outline shader. I notices an error: When you shift the outline into the four diagonal directions by vec2(size.x, size.y) etc., then the outline on diagonal edges of the sprite will be too thick by a factor of sqrt(2). (this is because the vector (size.x, size.y) is longer than the vectors (size.x,0) and (size.y,0).

The effect is very subtle, but if you look closely, you see that the outline of your circle is a little bit too thick in the four diagonal directions. This can probably be solved by dividing the diagonal vectors by sqrt(0.5).

NathanLovato commented 5 years ago

Just saw your comment. True, and thanks! Now it's common to use approximations with shaders. As long as it doesn't look too bad it's fine. sqrt calls are pretty heavy, if you can you don't want to do them for every pixel in your object. This outline effect is already a big approximation in itself as we're just creating and offsetting copies of the sprite in 4 or 8 directions only.