I want to render the outline of a cube, which includes the ‘front-facing’ edges. I don’t want to be able to see through the mesh, so a wireframe or edgesGeometry wouldn’t fit in this scenario (see demo codepen - https://codepen.io/danlong/pen/KbEVKp?editors=1010 ) I don’t want to duplicate the cube …

Hi! Straight from the twilight zone of my mind: https://jsfiddle.net/prisoner849/96npfk1r/ [EdgedBox] I’m not sure that the approach is efficient enough. The other users can comment on it :slight_smile:

Have you tried to use THREE.OutlinePass (a post-processing approach)? https://threejs.org/examples/webgl_postprocessing_outline Set the hiddenEdgeColor parameter to 0x000000 so hidden edges are not visible in the demo.

Thank you @prisoner849 and @Mugen87 for your ideas. I’ll investigate both of these options and see what I come up with :slight_smile:

Amazing. How can I use it for any meshes?

@Signa This is a very specific solution, intended excelusively for boxes.

@danlong I think there’s a better solution, using this shader: http://madebyevan.com/shaders/grid/ https://jsfiddle.net/prisoner849/kmau6591/ [BoxEdges]

Oh, awesome. I’ll take a look and think about implementing! Thanks for the info :slight_smile:

Hey there! im a newbie in this field and i was wondering if there is a way to render only the borders. in other words i want the pure black to be fully transparent and only the borders to be visible. Thanks in advance :smiley:

Maybe this helps? From the Collection of examples from discourse.threejs.org EdgesGeometry-InstancedMesh FatLineEdges

How to render geometry edges?

Questions

prisoner849 February 4, 2021, 5:46pm 11

In addition to @hofk 's links: LDraw-like edges

Topic		Replies	Views
How to show only edge lines? Questions outline	12	10438	March 5, 2022
Edge finding and highlighting Resources geometry , shaders	14	3827	September 4, 2024
How to show the outline for a cylinder without any post processing? Questions geometry , outline	4	1913	November 16, 2023
How Can I Render Only Visible Edges as Outlines Using an Orthographic Camera in Three.js? Questions geometry , shaders , glb	2	341	July 10, 2024
Depicting Edges Questions geometry	5	808	November 21, 2019

How to render geometry edges?

Related topics