react-postprocessing: Outline/SelectiveBloom not rendering

Hi,

I am trying to use the Outline and/or selective bloom on some meshes, and while there is no error generated, the effects don’t seem to be shown. I have made a code sandbox to illustrate the behavior. I based this off the examples I could find, but there weren’t any updated ones for these effects here, so it is possible I am referencing something outdated.

Of note, my original example used forward references on groups as the arguments to selection, but I have tried this with forward references to meshes, and even normal references to both without success.

About this issue

  • Original URL
  • State: open
  • Created 3 years ago
  • Reactions: 4
  • Comments: 17 (2 by maintainers)

Most upvoted comments

Hey, disabling autoclear seems to work!

  <EffectComposer autoClear={false}>

There are probably side-effects to this workaround though.

I confirm that I only tested on meshes, not groups. Considering that the selection is added to a layer and that groups cannot be added to layers, I’m not surprised it didn’t work.

I do have the same need though, and I’m using some convoluted solution to collect all the meshes I need to add to the selection to be outlined. I would prefer to add a property on my meshes or groups (a bit like castShadow) and have the effect traverse my tree to build the selection, but that’s not how it was designed.

I did notice this issue too. If it helps, I took an old demo of yours, updated the code to bump dependencies, including postprocessing to its latest version, and it still works. Here’s the sandbox link. However, if I bump a bit more (which requires to update drei, fiber, postprocessing to their new names), it won’t work. So the bug must be in @react-three/postprocessing.

@cptSwing The solution now is to use <Selection/> (see here). I have found this to work for me pretty well, as long as I kept autoClear={false} in the <EffectComposer/>

I’m having the same problem and adding autoClear={false} on the <EffectComposer> works for me.

EDIT: now nearly a month later and I have yet to see any negative side effects from doing this.

Just in case a [non] working example is useful, here is a code sandbox link:

https://codesandbox.io/s/react-postprocessing-ssao-smaa-and-bloom-demo-forked-jvtvz

After looking at it, I am not positive that standard Bloom is working either. Maybe I just didn’t set the params in a way that made it obvious enough.

Thanks again for the help!