Ir al contenido principal

How to integrate TensorflowJs and Unity by Creating a simple guessing game

This is a Tensorflow.js tutorial for integrating a javascript library with Unity, above is the vid and below you will find some of the steps followed.
  1. 1.

    Pre-reqs

  2. 2.

    Create the game using the Unity editor

  3. 3.

    Integrate unity with a javascript library like tensorflow.js - Calling a javascript library from unity

    • Create a class in unity with the methods that you already have in javascript
      • > Real "GetPrediction" method for using in webgl
          
        [DllImport("__Internal")]
        public static extern int GetPrediction(int valueToPredict);
          
        
      • > Debug "GetPrediction" method for using inside the editor
          
        #if UNITY_EDITOR
            public static int GetPrediction(int valueToPredict) {
                Debug.Log("Called GetPrediction");
        
                return 1;
            }
        #else
            //Real Method here
        #endif
          
        
    • Create a jslib file inside Assets/Plugins/WebGL with the "GetPrediction" method to be called
        
      mergeInto(LibraryManager.library, {
        //...
        GetPrediction: function (valueToPredict) {
          //Your logic here
          return window.PublicInterface.getPrediction(valueToPredict);
        }
      });
        
      
  4. 4.

    Integrate unity with a javascript library like tensorflow.js - Calling a unity C# method from javascript

    • Create a jslib file inside Assets/Plugins/WebGL with the "SendMessage" call referencing the name for the game object inside the scene and the method to be called
        
      mergeInto(LibraryManager.library, {
        //...
      
        //SendMessage('Game object name on scene', 'Method inside one of the components');
        SendMessage('PublicInterface', 'TrainingDone');
      
        //...
      });
        
      
    • Create a class in unity with the methods that you already have in javascript
      • > "TrainingDone" C# method for calling from javascript
          
        public class UnityInterfaceController : MonoBehaviour {
            public void TrainingDone() {
                //More code
            }
        }
          
        
    • Have a game object on the scene with the UnityInterfaceController monobehavior component attached to it
  5. 5.

    Create a node.js application to handle the integration with tensorflow.js

    • Change to the directory where the npm project is
        
      cd ./Assets/WebGLTemplates/TensorflowJsProjects/1.SimpleSequence
        
      
    • Install all the dependencies
        
      npm install
        
      
    • Start the compilation process
        
      npm run dev
        
      
    • Modify any .ts file and find the generated .js file inside ./Builds/WebGL/js/
  6. 6.

Entradas populares de este blog

Creating a Docker container for a NodeJs application: Express + Mongo + Docker Compose

This is a Docker tutorial for creating a NodeJs container using expressjs and mongoose, above is the vid and below you will find the steps followed.
StepsPre-reqsHave node.js installedAnd docker installed (make sure you have docker-compose as well)Create an simple node app using expressjs and mongooseModify your container and create a docker-compose fileBuild and Run your new container Create your simple node appInitialize the node appnpm initInstall the dependencies for our appnpm install --save express mongoose Create the database.jsCreate the index.js Create a dockerfileInclude container with node preinstalled: FROM nodeCreate default/working directory: WORKDIR /usr/src/appCopy package.json to workdir and install dependencies (which we will need in this case😊): COPY package.json .RUN npm install Copy the rest of the app (just the index.js file in this case)COPY . .Expose the port required for reaching our expressjs appEXPOSE 3000Add a command to run when this container is star…

Creating a Mongo replicaset using docker: Mongo replicaset + Nodejs + Docker Compose

This is a Docker tutorial for creating a Mongo replica set using docker compose and also a couple more containers to experiment with the replica set, above is the vid and below you will find some of the steps followed.
StepsPre-reqsHave node.js installedAnd docker installed (make sure you have docker-compose as well)Create a container for defining configurations for a mongo instanceCreate a container for setting up the replica setCreate a simple node app using expressjs and mongoose (A modified version from the previous video)Create a docker-compose file with the mongo and setup containers and two additional containers for experimenting with the replica setBuild, Run and experiment with your new containers Create a dockerfile for the first mongo container (not really needed but you could configure more stuff if needed)Include container with mongo preinstalled: FROM mongoCreate default/working directory: WORKDIR /usr/src/configsCopy mongo's configurations file into the container
C…

Creating a tensorflow.js + vue.js simple application in javascript

This is a Tensorflow.js tutorial for creating a simple application using Vue.js, above is the vid and below you will find some of the steps followed. Steps Pre-reqs Have node.js installed Create the Vue.js application using nuxt.js Add support for tensorflow.js in vue.js and add a simple model Add the simple tensorflow.js model using vue.js into github pages Create the Vue.js application using nuxt.js Install vue.js cli npm install -g vue-cli Create a base Vue.js app using the starter kit from Nuxt vue init nuxt-community/starter-template simple-vue-tensorflow Start the dev server npm run dev Create empty component components/TensorflowExample.vue Add the component into the page pages/index.vue …