# Simple shadow mapping example

**URL:** <https://forum.defold.com/t/simple-shadow-mapping-example/47628>\
**Category:** The Defoldmine\
**Created:** [March 28, 2019, 12:50pm UTC](https://forum.defold.com/t/simple-shadow-mapping-example/47628 "2019-03-28T12:50:34Z")\
**Posts on this page:** 19\
**Page:** 4

<div class="post-metadata">

**Author:** ![morgerion](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/morgerion/32/6641_2.png) [@morgerion](https://forum.defold.com/u/morgerion)\
**Post date:** [June 22, 2022, 9:27am UTC](https://forum.defold.com/t/simple-shadow-mapping-example/47628/61 "2022-06-22T09:27:00Z")

</div>

Sorry, but I always use highp. I hate low and medium precision.

I can guess that the problem may be in the sampler mapping via glGetUniformLocation(). Or there might be a GLES2 legacy hiding somewhere, which prevents float samplers from being set correctly. This, by the way, may be indicated by the crash of the build when trying to use float formats other than R32F.

---

<div class="post-metadata">

**Author:** ![Dragosha](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/dragosha/32/5103_2.png) [@Dragosha](https://forum.defold.com/u/Dragosha)\
**Post date:** [June 22, 2022, 12:24pm UTC](https://forum.defold.com/t/simple-shadow-mapping-example/47628/62 "2022-06-22T12:24:39Z")

</div>

I’ve tried to test shadow’s render target _render.FORMAT\_R32F_ on my mobile. And it works correct. But the app lags noticeably.

 ![Screenshot_20220622-170700](https://forum-defold.b-cdn.net/uploads/default/original/3X/6/7/67b4ab43d3115ce1d050e9dc9a64cae9b4261456.jpeg)  
Screenshot from Google Pixel 2XL. (4y.o. model).

Then I replaced render target back to render.FORMAT\_RGBA and the app works smooth again. Not sure why.

 ![Screenshot_20220622-171115](https://forum-defold.b-cdn.net/uploads/default/original/3X/0/4/04469ac8c3765d52a19bbec61e41a747607a9381.jpeg)  
Screenshot from the same device.

P.s. I use 2048x2048 depth buffer

---

<div class="post-metadata">

**Author:** ![Christo123](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/christo123/32/27575_2.png) [@Christo123](https://forum.defold.com/u/Christo123)\
**Post date:** [July 3, 2022, 10:07pm UTC](https://forum.defold.com/t/simple-shadow-mapping-example/47628/63 "2022-07-03T22:07:33Z")

</div>

Hello,  
How do you draw debug camera frustum?

 ![IMG_20220704_001911](https://forum-defold.b-cdn.net/uploads/default/original/3X/8/4/84e9e4806ee0a36de4b32cb85905569b1b27a6b5.jpeg)

Regards

---

<div class="post-metadata">

**Author:** ![morgerion](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/morgerion/32/6641_2.png) [@morgerion](https://forum.defold.com/u/morgerion)\
**Post date:** [July 15, 2022, 3:54pm UTC](https://forum.defold.com/t/simple-shadow-mapping-example/47628/64 "2022-07-15T15:54:54Z")

</div>

As long as I don’t have guaranteed float render-targets, I make shadows using RGBA texture to record depth.  
And here I’ve encountered a strange bug that shows up consistently on all iPhones and iPads (I’ve tested devices from iPhone7 to 12 Pro and several iPads):

 ![2022-07-15 16.18.27](https://forum-defold.b-cdn.net/uploads/default/original/3X/9/1/91e108b208d7ab12b3ef58c1f0c74c0eeb411b09.png)  
It looks as if the RGBA channels are less than 8 bits.

I wasn’t able to find the cause, but I was able to artificially reproduce this error on Android by lowering the storage accuracy of the four RGBA channels, but still leaving the same entire unpacking formula from RGBA to float (i use this formula: [Encoding floats to RGBA - the final? · Aras' website](https://aras-p.info/blog/2009/07/30/encoding-floats-to-rgba-the-final/))

What solution do you recommend?

---

<div class="post-metadata">

**Author:** ![jhonny.goransson](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/jhonny.goransson/32/3864_2.png) [@jhonny.goransson](https://forum.defold.com/u/jhonny.goransson)\
**Post date:** [July 18, 2022, 6:58am UTC](https://forum.defold.com/t/simple-shadow-mapping-example/47628/65 "2022-07-18T06:58:50Z")

</div>

Could you share the project with me, or a smaller repro? iPhones having less precision on newer devices doesn’t sound right 🤔 jhonny@defold.se

EDIT: Found the issue with your F32 texture sampling, so you might not need to do the encoding. See [Render-target with float format doesn't work · Issue #6730 · defold/defold · GitHub](https://github.com/defold/defold/issues/6730)

---

<div class="post-metadata">

**Author:** ![morgerion](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/morgerion/32/6641_2.png) [@morgerion](https://forum.defold.com/u/morgerion)\
**Post date:** [July 18, 2022, 5:49pm UTC](https://forum.defold.com/t/simple-shadow-mapping-example/47628/66 "2022-07-18T17:49:54Z")

</div>

I solved this problem by turning off linear texture filtering (yes, there it is again!).  
It’s a pity, I wanted to have smoothed shadows, but while filtering on androids is accurate enough, on iPhones it’s not.

Nevertheless, I will prepare and send a project with this error later, perhaps you will be interested to see it.

---

<div class="post-metadata">

**Author:** ![jhonny.goransson](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/jhonny.goransson/32/3864_2.png) [@jhonny.goransson](https://forum.defold.com/u/jhonny.goransson)\
**Post date:** [July 18, 2022, 6:16pm UTC](https://forum.defold.com/t/simple-shadow-mapping-example/47628/67 "2022-07-18T18:16:39Z")

</div>

We are discussing support for adding extensions in some way, so hopefully you can get that in some near ish future 🙂 you can do the sampling yourself aswell but it’s a bit expensive for low end I’m afraid

---

<div class="post-metadata">

**Author:** ![morgerion](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/morgerion/32/6641_2.png) [@morgerion](https://forum.defold.com/u/morgerion)\
**Post date:** [September 11, 2022, 4:16pm UTC](https://forum.defold.com/t/simple-shadow-mapping-example/47628/68 "2022-09-11T16:16:56Z")

</div>

Due to the advent of float RT, I have converted my shadows to R32F format. And discovered the unpleasant thing - for some old (and not so old) smartphones the R16F format is somehow used instead of the R32F format.

If I use RGBA32 and convert the shadow depth to 4 components (R,G,B,A) then everything works correctly on all smartphones and PCs.  
While this is a good solution, it is saddening to have to do a dot() for each texture read and normalize the shadow depth to a range of 0…1.

But the unpredictable switching in 16F is a nuisance. Is there anything you can do about it?

---

<div class="post-metadata">

**Author:** ![jhonny.goransson](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/jhonny.goransson/32/3864_2.png) [@jhonny.goransson](https://forum.defold.com/u/jhonny.goransson)\
**Post date:** [September 11, 2022, 4:49pm UTC](https://forum.defold.com/t/simple-shadow-mapping-example/47628/69 "2022-09-11T16:49:06Z")

</div>

Not sure, it’s a pretty classic problem with OpenGL and old devices. But maybe we could expose values from this function [glGetShaderPrecisionFormat](https://registry.khronos.org/OpenGL-Refpages/es2.0/xhtml/glGetShaderPrecisionFormat.xml) so you can do the workaround necessary. Alternatively I guess you could split the value over two R16 channels. But usually 16F should be enough for shadows I would think, but I guess it depends on your needs..

---

<div class="post-metadata">

**Author:** ![morgerion](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/morgerion/32/6641_2.png) [@morgerion](https://forum.defold.com/u/morgerion)\
**Post date:** [September 11, 2022, 4:56pm UTC](https://forum.defold.com/t/simple-shadow-mapping-example/47628/70 "2022-09-11T16:56:10Z")

</div>

Yeah, I jumped to conclusions a bit. 🙂  
Indeed, the 16 bit format should be enough.  
Indeed, when I tweaked the bias, everything was almost fine.  
Moreover, even the position recovery from depth was not affected (well, or it’s imperceptible to the eye). 🙂  
SSAO didn’t feel the drop in accuracy from 32 to 16 bit at all, apparently it doesn’t care about such subtleties. 🙂

---

<div class="post-metadata">

**Author:** ![jhonny.goransson](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/jhonny.goransson/32/3864_2.png) [@jhonny.goransson](https://forum.defold.com/u/jhonny.goransson)\
**Post date:** [September 11, 2022, 5:02pm UTC](https://forum.defold.com/t/simple-shadow-mapping-example/47628/71 "2022-09-11T17:02:05Z")

</div>

Good to hear! 👍

---

<div class="post-metadata">

**Author:** ![morgerion](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/morgerion/32/6641_2.png) [@morgerion](https://forum.defold.com/u/morgerion)\
**Post date:** [September 11, 2022, 5:21pm UTC](https://forum.defold.com/t/simple-shadow-mapping-example/47628/72 "2022-09-11T17:21:27Z")

</div>

What the hell! When using the R16F directly, the smartphone crashes with error GL 1282. Classic!  
So I am forced to always specify R32F, expecting to sometimes get R16F. It’s all right, we’ll get over it somehow.

---

<div class="post-metadata">

**Author:** ![jhonny.goransson](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/jhonny.goransson/32/3864_2.png) [@jhonny.goransson](https://forum.defold.com/u/jhonny.goransson)\
**Post date:** [September 11, 2022, 5:41pm UTC](https://forum.defold.com/t/simple-shadow-mapping-example/47628/73 "2022-09-11T17:41:20Z")

</div>

Hmm on more than one device? You might be facing some strange driver edge case.. old android is a minefield of issues like this unfortunately. But if it’s an es3 device you should be able to request 16F, I’ll do some investigation this week but you might want to use the 32F solution for now if it works..

---

<div class="post-metadata">

**Author:** ![Goldenthumbs](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/goldenthumbs/32/30469_2.png) [@Goldenthumbs](https://forum.defold.com/u/Goldenthumbs)\
**Post date:** [December 5, 2022, 5:55pm UTC](https://forum.defold.com/t/simple-shadow-mapping-example/47628/74 "2022-12-05T17:55:17Z")

</div>

For people reading this now or in the future, do NOT use anything other than point filtering for depth targets if you are testing for differences in depth yourself. I believe that some graphics APIs have a sampler type for shadow mapping that allows for getting some basic PCF running with linear filtering, but I do not believe Defold allows you to access that currently. The reason you do not want to use linear filtering on depth targets is it gives you incorrect depth values (remember this is depth information, not color information) You are basically blurring the depth buffer, which when testing against fragment depth you will get artifacts. It only gets worse when you are using some form of encoding on your depth buffer.

---

<div class="post-metadata">

**Author:** ![Goldenthumbs](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/goldenthumbs/32/30469_2.png) [@Goldenthumbs](https://forum.defold.com/u/Goldenthumbs)\
**Post date:** [December 5, 2022, 5:58pm UTC](https://forum.defold.com/t/simple-shadow-mapping-example/47628/75 "2022-12-05T17:58:11Z")

</div>

If you want smooth shadows, there are other solutions. One simple solution is PCF, which acts as a form of antialiasing (or really a blur). Combine that with linear filtering in the shader (after you have tested your depth values) and you get decent shadows.

---

<div class="post-metadata">

**Author:** ![morgerion](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/morgerion/32/6641_2.png) [@morgerion](https://forum.defold.com/u/morgerion)\
**Post date:** [December 5, 2022, 8:21pm UTC](https://forum.defold.com/t/simple-shadow-mapping-example/47628/76 "2022-12-05T20:21:54Z")

</div>

OK, I made a PCSS. It works pretty well on a mobile phone.

 ![shadow](https://forum-defold.b-cdn.net/uploads/default/original/3X/5/b/5b21626ecf24bba24dbd220c3b72ae2767366cf2.jpeg)

---

<div class="post-metadata">

**Author:** ![Goldenthumbs](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/goldenthumbs/32/30469_2.png) [@Goldenthumbs](https://forum.defold.com/u/Goldenthumbs)\
**Post date:** [December 5, 2022, 9:17pm UTC](https://forum.defold.com/t/simple-shadow-mapping-example/47628/77 "2022-12-05T21:17:51Z")

</div>

CORRECTION: Linear filter should be fine if you are using a standard depth target… If you encode it however, there will be issues.

---

<div class="post-metadata">

**Author:** ![totebo](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/totebo/32/36087_2.png) [@totebo](https://forum.defold.com/u/totebo)\
**Post date:** [December 5, 2022, 10:30pm UTC](https://forum.defold.com/t/simple-shadow-mapping-example/47628/78 "2022-12-05T22:30:30Z")

</div>

> [@morgerion](#):
>
> OK, I made a PCSS. It works pretty well on a mobile phone.

This looks great! Would you be able to share the code?

---

<div class="post-metadata">

**Author:** ![morgerion](https://forum-defold.b-cdn.net/user_avatar/forum.defold.com/morgerion/32/6641_2.png) [@morgerion](https://forum.defold.com/u/morgerion)\
**Post date:** [December 6, 2022, 6:20pm UTC](https://forum.defold.com/t/simple-shadow-mapping-example/47628/79 "2022-12-06T18:20:09Z")

</div>

Yes, I’ll try to make it quick.

[Previous page](https://forum.defold.com/t/simple-shadow-mapping-example/47628.md?page=3)
