Yuka Game AI Library with Babylon.js

Yuka is a JavaScript library for developing Game AI. Yuka is a standalone library and independent of a particular 3D engine. The idea is to implement the actual game logic with Yuka and the visual representation with your preferred JavaScript 3D library.

Until now all Yuka examples were made with Three.js. I started from steering behaviours - have a look at Yuka | Examples with Babylon.js
If you would like to participate in this project, let me know :slight_smile:

16 Likes

@labris, this is awesome! Put me on the list of participants please! :vulcan_salute:

1 Like

cc @PirateJC would be so cool to have a showcase link at the top of their site too :wink:

2 Likes

Very cool @labris! Please keep us posted on this project. It looks very exciting!

1 Like

I was doing some research on native game engines and concluded yuka drew a lot of “inspiration” from opensteer (developed by sony a long time ago). It also seems to commonly be used in conjunction with recast, which is great because bjs already uses recast. Hopefully, this background knowledge can help widen the search on ideas.

you can see here opensteer + recast combo
.Google Code Archive - Long-term storage for Google Code Project Hosting.

babylon has a recastjs plugin
.RecastJSPlugin | Babylon.js Documentation

and recastjs is included by default in babylon native
.BabylonNative/Apps/Dependencies at master · BabylonJS/BabylonNative · GitHub

opensteer resources:
.http://opensteer.sourceforge.net/
.Search · opensteer · GitHub
.GitHub - meshula/OpenSteer: OpenSteer is a C++ library to help build steering behaviors for autonomous characters in games and animation. (this one seems a little bit modernized, using glfw and cmake)

alternative / supplemental libs:
godot 4 ai based pathfinding is based on this lib:
.GitHub - snape/RVO2: Optimal Reciprocal Collision Avoidance (C++)
.Godot 3.5 Beta - YouTube first part of this video covers it

RVO2 is using a kd tree which there is an excellent explanation here by the creator of regl:
.GitHub - mikolalysenko/static-kdtree: A static kdtree data structure
(see also rb tree or red-black tree)

also another great js library
.GitHub - anvaka/ngraph.path: Path finding in a graph
check this demo out, its very impressive.
.GitHub - anvaka/ngraph.path.demo: This is a demo project for ngraph.path

2 Likes

I want to evaluate YUKA and compare with recast.js. I am too lazy to init a new project, so I tried to get YUKA into a babylon.js PG. It seems to be working fine. Here is a blank PG with YUKA imported.

Update: Somehow after reloading browser, YUKA is not loaded first time and give error. Need to press Run button then it starts working.

1 Like

Here is one of the simplest Yuka examples - Orientation: Babylon.js Playground

You may have a look at more ready Babylon.js examples (before “official” release which will be very soon - UPD: here it is) here - GitHub - eldinor/yuka-babylonjs-examples: Yuka Game AI + 3D rendering with Babylon.js

Navmesh is incredible :slight_smile:

4 Likes

Hi @labris

It seems you don’t need your own animate function to step babylon scene rendering and yuka world. You can subscribe to scene.registerBeforeRender. The babylon way! :smile:

Argh. I was stuck on converting this example to PG for a long time. Then I switched babylon.js version of the PG from 5.0 to 4.2.1. It starts to work!

Update: I added a hack so YUKA is not loaded error won’t throw when refresh the browser page or launching PG for the first time. :smile:

I think the problem is from the following code from @labris YUKA example, which is not working in babylon.js 5.0.

function sync( entity, renderComponent ) {
    entity.worldMatrix.toArray( entityMatrix.m );
    const matrix = renderComponent.getWorldMatrix();
    matrix.copyFrom( entityMatrix );
}

renderComponent is the cone mesh created in babylon.js. entity is the cone modeled in YUKA environment. It seems this api to set transformation matrix to the cone doesn’t work in babylon.js 5.0 any more, but works in 4.2.

For 5.0 one needs to add entityMatrix.markAsUpdated()
This function now looks like

    function sync(entity, renderComponent) {
        entity.worldMatrix.toArray(entityMatrix.m)
        entityMatrix.markAsUpdated()

        const matrix = renderComponent.getWorldMatrix()
        matrix.copyFrom(entityMatrix)
    }

Now it will work with 5.0 - https://playground.babylonjs.com/#Q4TM0Z#25
All Github examples are already prepared for 5.0.

1 Like

Sure, for PG it will work. For standalone examples it may depend.
Also, Yuka lets to separate the game logic from the rendering engine; it is up to you to decide which one to use.

try this (or you can await instead of .then())

import('https://mugen87.github.io/yuka/build/yuka.module.js').then(yuka => {
     console.log('imported...', yuka);
     window.YUKA = yuka;
});
4 Likes

Ooh that was the missing piece, import.then(). :slight_smile: Here’s a version that awaits the promise without the while loop.

3 Likes

I just had it in the createScene method directly, but that’s another way!! :smile:
ie:

const YUKA = await import('https://mugen87.github.io/yuka/build/yuka.module.js');
3 Likes

LOL that’s much simpler, I could have sworn importing modules didn’t work in playground when I tried it a few weeks ago for Rapier. Thanks for info and fix! :slight_smile:

2 Likes

Hey guys!

The BabylonJS examples we are hardly working on with @labris are not intended to demonstrate BabylonJS at it’s best in the first round but mainly to show YUKA’s capabilities.

We are using the THREE examples for the base code and the existing helper classes created for THREE and are rewriting them. There are lot of things we would do absolutely differently but starting from scratch would take ages to finish the examples and we wanted to deliver ASAP.

After we release the first version feel free to contribute and rewrite the examples in a better way. So basically the examples are not currently about BabylonJS best practices.

However we have plans to rewrite the examples in TS from scratch implemented with best approaches known to us.

@slin the same applies to the animate method.

:vulcan_salute:

2 Likes

This PG does not work in 5.0 anymore. Same with this:

It works if you hit the Run button again.
Version with the correct script loading is here - Babylon.js Playground

1 Like

And here is the link to the 1st release thread - Yuka Game AI + Babylon.js Examples - the 1st Release

1 Like