Question on convexhull and wireframe

Questions
,
1

Hello friends

I have a mesh that I put a convexhull around it with the material being transparent here is the material code:

let materialcell = new THREE.MeshLambertMaterial( {
color: 0xffffff ,
opacity: 0.2,
side: THREE.DoubleSide, ``//THREE.BackSide``, ``//THREE.DoubleSide``,
wireframe: false,
flatShading: true,
transparent: true
} );

The result is a mesh which is transparent with convexhull halo around it per below svreenshot:

Screenshot 2026-08-22 223314
Screenshot 2026-08-22 2233141100×594 170 KB

So far so good. Now if I enable wireframe the halo will go aways per below screenshot:

Screenshot 2026-08-22 223335
Screenshot 2026-08-22 2233351125×597 220 KB

I read somewhere that you can have both on and once you turn on wireframe option the halo will not show up. My quesiotn is: is there a worj around here so we can show both at the same time.

I alao tired edgeGeometry and THREE.WireframeGeometry but I did not see any difference. I am using the followinfg code currently to create this convexhull:

          let geometrycell = new ConvexGeometry( [...cellConvexhullSet] );


                  let materialcell = new THREE.MeshLambertMaterial( {
                    color: 0xffffff ,
                    opacity: 0.2,
                    side: THREE.DoubleSide, //THREE.BackSide, //THREE.DoubleSide,
                    wireframe: true,
                    flatShading: true,
                    transparent: true
                  } );

                   let meshcell = new THREE.Mesh( geometrycell, materialcell );

                    scene.add( meshcell );

Thank you in advance for any suggestions/help

2

When I need something like this, I usually go the simple way – two meshes with shared geometry. One mesh is the semitransparent “halo” and wireframe:false, the other is with wireframe:true. Thus both – filled faces and edges will be drawn. However, you might notice that sometimes some edges go below the “halo”, sometimes above the “halo”. This is resolved by pushing the halo slightly back via polygonOffset, polygonOffsetFactor and polygonOffsetUnits.

Here is a snapshot of a game I made some time ago. The convex hull is one geometry shared between two meshes with different materials.

image
image1920×1080 213 KB

3

Thank you very much @PavelBoytchev . That worked for me. I did use the following params to experiment with these values in the wireframe material mesh:

polygonOffset: true,
polygonOffsetFactor: -1.0, // Pulls the polygon closer to the camera
polygonOffsetUnits: -4.0,

But my wireframe lines did not look solid and rather looked dashed as I was zooming in and out. So, I took them out and it worked better. My question is what values do you use for the above three params.

Thanks again

4

The polygon offset works only for filled polygons. So you have to apply it to the other mesh – the one that is not wireframe.

Demo:

https://codepen.io/boytchev/full/OPpJjQq

image

5

Thank you @PavelBoytchev