How to render first with transparent double sided material? (r3f, react-three fiber)

Hi I’m trying to render Bounding Box that always rendered first
so I change material’s props depthTest, depthWrite false.
but with double sided transparent material, it doesn’t work… how to fix this…?

left is not transparent, right is transparent with double sided

My code sandbox below Thanks in advance

Try rendering the outlines in a separate .render call, clearing only color / stencil in-between calls - that way everything in the second call will appear above the first one, regardless how the materials are set up.

Example (lines 67+ mostly)

1 Like

@mjurczyk Thanks for suggestion also your examples but I fixed like this, it works

//Material Setting
    depthTest: false,
    depthWrite: false,
    transparent: true,
    polygonOffset: true,
    polygonOffsetFactor: -10,
    toneMapped: false,
//Object3D Setting that use MaterialSetting above
  renderOrder = 1

referrence : PivotControls in drei, Github issues in three.js How to use polygonOffset solving Z-fighting poblems