# Wireframe with solid inside for gltf

**URL:** <https://discourse.threejs.org/t/wireframe-with-solid-inside-for-gltf/10141>\
**Category:** Questions\
**Created:** [October 10, 2019, 8:15pm UTC](https://discourse.threejs.org/t/wireframe-with-solid-inside-for-gltf/10141 "2019-10-10T20:15:06Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![Josh\_Lopez](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/josh_lopez/32/7567_2.png) [@Josh\_Lopez](https://discourse.threejs.org/u/Josh_Lopez)\
**Post date:** [October 10, 2019, 8:15pm UTC](https://discourse.threejs.org/t/wireframe-with-solid-inside-for-gltf/10141/1 "2019-10-10T20:15:06Z")

</div>

can anyone please help me? i am trying to make a camera have a wireframe with a solid color inside that matches the background. i was able to get the wireframe part working but cant add a solid color inside. here is my codepen. [https://codepen.io/joshofdevelopment/pen/Jjjdqxa](https://codepen.io/joshofdevelopment/pen/Jjjdqxa)

i have been looking all over stackoverflow for something that can help but cant find anything for my specific use case. here is one i found but when trying to implement  
i get a bunch of errors. [https://stackoverflow.com/questions/31539130/display-wireframe-and-solid-color](https://stackoverflow.com/questions/31539130/display-wireframe-and-solid-color)

i believe my use case is different because my meshes are in a group from the gltf file? To be honest im not sure. My head hurts.

---

<div class="post-metadata">

**Author:** ![Josh\_Lopez](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/josh_lopez/32/7567_2.png) [@Josh\_Lopez](https://discourse.threejs.org/u/Josh_Lopez)\
**Post date:** [October 10, 2019, 8:26pm UTC](https://discourse.threejs.org/t/wireframe-with-solid-inside-for-gltf/10141/2 "2019-10-10T20:26:57Z")

</div>

i think i might have to combine all the mesh children in the group first but i cant figure that out either.

---

<div class="post-metadata">

**Author:** ![prisoner849](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/prisoner849/32/535_2.png) [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Post date:** [October 10, 2019, 9:07pm UTC](https://discourse.threejs.org/t/wireframe-with-solid-inside-for-gltf/10141/3 "2019-10-10T21:07:28Z")

</div>

Hi!  
Are you trying to achieve something like that:  
[https://codepen.io/prisoner849/pen/PooPEeR?editors=0010](https://codepen.io/prisoner849/pen/PooPEeR?editors=0010)

---

<div class="post-metadata">

**Author:** ![Josh\_Lopez](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/josh_lopez/32/7567_2.png) [@Josh\_Lopez](https://discourse.threejs.org/u/Josh_Lopez)\
**Post date:** [October 10, 2019, 9:13pm UTC](https://discourse.threejs.org/t/wireframe-with-solid-inside-for-gltf/10141/4 "2019-10-10T21:13:57Z")

</div>

omg yes!!! thank you so much!

---

<div class="post-metadata">

**Author:** ![Josh\_Lopez](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/josh_lopez/32/7567_2.png) [@Josh\_Lopez](https://discourse.threejs.org/u/Josh_Lopez)\
**Post date:** [October 10, 2019, 9:15pm UTC](https://discourse.threejs.org/t/wireframe-with-solid-inside-for-gltf/10141/5 "2019-10-10T21:15:07Z")

</div>

you have saved me from going insane!

---

<div class="post-metadata">

**Author:** ![marquizzo](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/marquizzo/32/25192_2.png) [@marquizzo](https://discourse.threejs.org/u/marquizzo)\
**Post date:** [October 10, 2019, 9:16pm UTC](https://discourse.threejs.org/t/wireframe-with-solid-inside-for-gltf/10141/6 "2019-10-10T21:16:17Z")

</div>

Neat!

Just to add alternatives, I think I saw a different approach on StackOverflow that suggests finding the edges in the Fragment shader, which gets rid of the tessellated look and helps with line thickness

> <https://stackoverflow.com/questions/56795062/how-to-get-three-js-linesegments-to-only-render-visible-lines>

… although this version is much more complicated to execute.

---

<div class="post-metadata">

**Author:** ![prisoner849](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/prisoner849/32/535_2.png) [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Post date:** [October 10, 2019, 9:17pm UTC](https://discourse.threejs.org/t/wireframe-with-solid-inside-for-gltf/10141/7 "2019-10-10T21:17:57Z")

</div>

You’re welcome 🙂  
But I’m sure that there can be better solution. This one is just the first that popped up in my head 🙂
