How does Material Wireframe work? My own wireframe shader?

Questions
1

Hi,

As as learning exercise, I want to use my own shaders to render a wireframe of a geometry, similar to a material with wireframe set to true.

I tried looking in the codebase and couldn’t figure out how it’s done.

2

Have you already studied webgl_materials_wireframe?

3

I hadn’t, thanks! Looking at the code now.

So I guess I need to study the particular geometry, see what attributes it sets, and then I can use those attributes in the vertex shader and possibly pass them via varying to the fragment.

This is something to run with for now, will post again if I run into more trouble, cheers!

4

Hey @Mugen87 I’ve tried to use the same vertex and fragment shader from the linked example but using it with PlaneBufferGeometry instead of the geometry in the example which does like:

geometry.deleteAttribute( 'normal' );
geometry.deleteAttribute( 'uv' );
geometry.setAttribute( 'center', new THREE.BufferAttribute( centers, 3 ) );

I’m guessing that the reason it’s not working with PlaneBufferGeometry is because of this, but if I just use a basic material with wireframe set to true then it works, so that material must be doing something that doesn’t require this geometry which sets the center attributes, right?

5

Actually don’t worry if you’re busy

I’m kinda getting it now, I think what I want is to just set the wireframe on the shader material and then play with the vertex shader :slight_smile:

Cheers!