Selective bloom on .jsx model

Hi! I’m able to make it work selective bloom in my scene using this library:

I have my gltf models imported as .jsx
import { Model as Roof01} from './models/car.jsx'

Using drei imported, but can’t make the Model to bloom only the Meshes i create.

I alredy try to useRef inside .jsx but still getting error :
postprocessing.esm.js:4781 Uncaught TypeError: Cannot read properties of undefined (reading ‘enable’)

@drcmda any toughts ? thankss

you don’t need select bloom, it is selective by default, all you have to do is increase color intensity, see GitHub - pmndrs/react-postprocessing: 📬 postprocessing for react-three-fiber

postprocessing is currently not able to take three > 148 due to a breaking change in three.

some example

the relevant code is just this:

      <EffectComposer disableNormalPass>
        <Bloom luminanceThreshold={1} mipmapBlur />
      </EffectComposer>

<mesh castShadow receiveShadow geometry={nodes.stripe001.geometry}>
  <meshBasicMaterial color={[10, 10, 10]} toneMapped={false} />

gotcha! didn’t saw that part. I was getting guide by the docs!

Thanks :slight_smile:

I got stuck sorry, but not sure how to assign and get acess to the geometry if my model is on .jsx format.
alredy try to assign it inside the .jsx and in app.js trying to add the material, but still getting a bunch of errors.
how can implemented to my .jsx model?

it has already textures as material

not sure what you mean, if you want to make changes to the gltf you use gltfjsx pretty much always. pick the mesh you want to glow and do this:

<mesh
  geometry={nodes......}
  material={materials......}
  material-toneMapped={false}
  material-color={[10, 10, 10]}

you can also use emissveIntensity, here’s a small tutorial about that

1 Like

Material-color was what i was missing thanks!