# Why can't I use this glb as Yuka navigation mesh

**URL:** <https://forum.babylonjs.com/t/why-cant-i-use-this-glb-as-yuka-navigation-mesh/31968>\
**Category:** Questions\
**Created:** [July 6, 2022, 7:48pm UTC](https://forum.babylonjs.com/t/why-cant-i-use-this-glb-as-yuka-navigation-mesh/31968 "2022-07-06T19:48:58Z")\
**Posts on this page:** 15\
**Page:** 1

<div class="post-metadata">

**Author:** ![br-matt](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/br-matt/32/22436_2.png) [@br-matt](https://forum.babylonjs.com/u/br-matt)\
**Post date:** [July 6, 2022, 7:48pm UTC](https://forum.babylonjs.com/t/why-cant-i-use-this-glb-as-yuka-navigation-mesh/31968/1 "2022-07-06T19:48:58Z")

</div>

I’m interested in exploring Yuka for some fun ideas. I am trying to use the basic navmesh demo to get learning with the VSCode Live Server recommended in its docs

The whole tab is hard locking and never coming back when I try to change the nav mesh loaded to [https://testasset.s3.amazonaws.com/casual\_collision.glb](https://testasset.s3.amazonaws.com/casual_collision.glb) wether remote or local. I see it downloading successfully in network tab.

No feedback in the console, wondering if any of the Yuka experts have some idea why

---

<div class="post-metadata">

**Author:** ![carolhmj](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/carolhmj/32/25918_2.png) [@carolhmj](https://forum.babylonjs.com/u/carolhmj)\
**Post date:** [July 6, 2022, 10:05pm UTC](https://forum.babylonjs.com/t/why-cant-i-use-this-glb-as-yuka-navigation-mesh/31968/2 "2022-07-06T22:05:58Z")

</div>

@labris and @roland are the best people to ask 😃

---

<div class="post-metadata">

**Author:** ![labris](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/labris/32/12576_2.png) [@labris](https://forum.babylonjs.com/u/labris)\
**Post date:** [July 7, 2022, 6:50am UTC](https://forum.babylonjs.com/t/why-cant-i-use-this-glb-as-yuka-navigation-mesh/31968/3 "2022-07-07T06:50:26Z")

</div>

I’ll check asap a bit later 🙂

---

<div class="post-metadata">

**Author:** ![labris](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/labris/32/12576_2.png) [@labris](https://forum.babylonjs.com/u/labris)\
**Post date:** [July 7, 2022, 3:02pm UTC](https://forum.babylonjs.com/t/why-cant-i-use-this-glb-as-yuka-navigation-mesh/31968/4 "2022-07-07T15:02:52Z")

</div>

Probably your GLTF asset contains rendering primitives other than TRIANGLES (.e.g. POINTS, LINES etc.). YUKA.NavMeshLoader makes the assumption that its geometry data are only defined with triangles.  
Also, try to use not GLB but GLTF+.bin files.  
A bit more info is here - [How to correctly export a NavMesh from Blender 2.8 · Issue #9 · Mugen87/yuka · GitHub](https://github.com/Mugen87/yuka/issues/9)

---

<div class="post-metadata">

**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\
**Post date:** [July 7, 2022, 5:23pm UTC](https://forum.babylonjs.com/t/why-cant-i-use-this-glb-as-yuka-navigation-mesh/31968/5 "2022-07-07T17:23:41Z")

</div>

Hi!

Your mesh has overlapping vertices/edges.

For example this one:

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/c/d/cd01a3d75cbc98d243b23306f3692b7336e67e53.jpeg)

Here is the proof. After moving the vertice you get this:

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/c/e/cecae0d34a5d6ee6e840dff8f7ebf12960e5982a.jpeg)

How to solve:  
First of all select all vertices in edit mode, press RMB, select Merge Vertice By Distance:

![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/2/8/287f7b454b5fdae85a27c3c6dbbb25c6c9d481d2.png)

Try to play with the Merge Distance so you have not lost any of your visible vertices.

Remove the extra triangles so your mesh looks like this:  
 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/5/3/5355088f270c249d8975c517a6a2b959f9eafae1.png)

In the last step Disolve the unneeded vertices:

![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/e/6/e60f70b580bd2b0bab936e242f70d6e9a6ae8181.png)

In Edge mode select all edges (shortcut ‘A’):

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/b/7/b772cddfb6b1a196e54ec031cb5c47cd1b292569.png)

Press ‘F’ to create an N-gon:

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/a/4/a4a5457f44e8b785dd060fe7713c42da81b94ede.png)

Export to GLB.

I’ve tried to use this technique on the lower part of the navmesh and YUKA was able to load it.

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/3/3/33e8e2830377aaf5cf8fbb74d3faf640748c5eba.png)

Cheers!

R.

🖖

---

<div class="post-metadata">

**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\
**Post date:** [July 7, 2022, 10:03pm UTC](https://forum.babylonjs.com/t/why-cant-i-use-this-glb-as-yuka-navigation-mesh/31968/6 "2022-07-07T22:03:17Z")

</div>

Partial success 🙂

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/b/a/ba71c3d210ab51b74f41692bb56ccfae7caad49c.png)

---

<div class="post-metadata">

**Author:** ![br-matt](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/br-matt/32/22436_2.png) [@br-matt](https://forum.babylonjs.com/u/br-matt)\
**Post date:** [July 7, 2022, 10:14pm UTC](https://forum.babylonjs.com/t/why-cant-i-use-this-glb-as-yuka-navigation-mesh/31968/7 "2022-07-07T22:14:32Z")

</div>

Thanks for the detailed instructions. We had some partial success trying a small segment with what you outlined:

[https://testasset.s3.amazonaws.com/casual\_collision11.glb](https://testasset.s3.amazonaws.com/casual_collision11.glb)

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/b/d/bde230273f6f72e69f7651635b5b70740d23b48f.png)

it loads but performance is visibly impacted moving the camera around on a macbook pro. Trying to do it to the entire space, never ends up loading.

I looked at the advanced navmesh example glb and there is a lot going on there and loads quickly and silky smooth. So must be some rule we are violating 😕

---

<div class="post-metadata">

**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\
**Post date:** [July 7, 2022, 10:42pm UTC](https://forum.babylonjs.com/t/why-cant-i-use-this-glb-as-yuka-navigation-mesh/31968/8 "2022-07-07T22:42:09Z")

</div>

So, my I’ve removed the EDIT that the approach is not working and the navmesh is not visible from my first answer becuase I’ve exported the GLB without any faces that’s why I couldn’t see the colored navmesh. The funny thing here is that YUKA seems to be not requiring any faces in the navmesh.

---

<div class="post-metadata">

**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\
**Post date:** [July 7, 2022, 10:42pm UTC](https://forum.babylonjs.com/t/why-cant-i-use-this-glb-as-yuka-navigation-mesh/31968/9 "2022-07-07T22:42:52Z")

</div>

The performance degradation comes from the graph helper. Try to comment it out and it will be speedy again:  
 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/a/5/a5bfbb842ffe8fb7b6b3c5dce477656cc67d897e.png)

---

<div class="post-metadata">

**Author:** ![br-matt](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/br-matt/32/22436_2.png) [@br-matt](https://forum.babylonjs.com/u/br-matt)\
**Post date:** [July 7, 2022, 10:58pm UTC](https://forum.babylonjs.com/t/why-cant-i-use-this-glb-as-yuka-navigation-mesh/31968/10 "2022-07-07T22:58:17Z")

</div>

Yup that sure did! Thanks again

---

<div class="post-metadata">

**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\
**Post date:** [July 7, 2022, 11:49pm UTC](https://forum.babylonjs.com/t/why-cant-i-use-this-glb-as-yuka-navigation-mesh/31968/11 "2022-07-07T23:49:16Z")

</div>

So actually there is nothing wrong with the navmesh itself 🙂 however I would recommend to merge by distance the duplicated vertices.

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/4/5/4577e91a97fba4a6f85badc5f01f050b6d5a83af.png)

---

<div class="post-metadata">

**Author:** ![roland](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/roland/32/38940_2.png) [@roland](https://forum.babylonjs.com/u/roland)\
**Post date:** [July 8, 2022, 7:30am UTC](https://forum.babylonjs.com/t/why-cant-i-use-this-glb-as-yuka-navigation-mesh/31968/12 "2022-07-08T07:30:20Z")

</div>

Hi guys!

@br-matt @labris

I’ve changed the `GraphHelper.js` so now it is using the `LineSystem` instead of multiple `Lines` so the performance issue is gone.

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/3X/5/7/57868f4daa119312979a6927b5a788595ca03d06.png)

> <https://github.com/eldinor/yuka-babylonjs-examples/blob/main/examples/js/graph/GraphHelper.js>

---

<div class="post-metadata">

**Author:** ![br-matt](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/br-matt/32/22436_2.png) [@br-matt](https://forum.babylonjs.com/u/br-matt)\
**Post date:** [July 8, 2022, 4:07pm UTC](https://forum.babylonjs.com/t/why-cant-i-use-this-glb-as-yuka-navigation-mesh/31968/13 "2022-07-08T16:07:02Z")

</div>

Thanks again! Yes, even the original mesh works now with the helper on but will stick to merging verts like you suggested 🙂

---

<div class="post-metadata">

**Author:** ![labris](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/labris/32/12576_2.png) [@labris](https://forum.babylonjs.com/u/labris)\
**Post date:** [July 9, 2022, 6:58am UTC](https://forum.babylonjs.com/t/why-cant-i-use-this-glb-as-yuka-navigation-mesh/31968/14 "2022-07-09T06:58:59Z")

</div>

Fell free to commit a PR with your case, each example could help other people to get some knowledge 🙂

---

<div class="post-metadata">

**Author:** ![br-matt](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/br-matt/32/22436_2.png) [@br-matt](https://forum.babylonjs.com/u/br-matt)\
**Post date:** [July 10, 2022, 10:43pm UTC](https://forum.babylonjs.com/t/why-cant-i-use-this-glb-as-yuka-navigation-mesh/31968/15 "2022-07-10T22:43:26Z")

</div>

Will do! Once its further along and can figure out some mock data that does not depend on our APIs
