v3d-core

WebGL-based humanoid model rendering engine.

Objectives

This project aims to be an easy-to-use library for rendering 3D and pseudo-2D humanoid models. We choose WebGL because of its portability across platforms, as well as the broad support from JavaScript community.

Features

• Contains one simple API for interacting with scene and models
• Supports .vrm file loading, including:
  • Unity Humanoid bone mapping
  • BlendShape morphing
  • Secondary Animation
  • MToonMaterial

Usage

Install from NPM

npm install v3d-core

In browser

Some older browsers may not be supported.

Please see examples/browser for an example.

A more complicated example can be found in examples/classroom.

On Babylon.js Playground

Currently, this is not possible since we use a modified Babylon.js fork.

For node.js and webpack

All modules support ES6 imports.

Please see index-test.ts for an example.

Contributing

See CONTRIBUTING.md.

Build

1. Clone this repo and submodules:

   git clone https://github.com/phantom-software-AZ/v3d-core.git --recurse-submodules

   If your Internet connection is slow, try the following instead:

   git clone https://github.com/phantom-software-AZ/v3d-core.git --recurse-submodules --shallow-submodules

2. Build Babylon.js

   cd lib/Babylon.js && git checkout master-custom && npm install
   cd Tools/Gulp && npm install
   gulp typescript-libraries --noGlobalInstall && gulp npmPackages-es6 --noGlobalInstall
   cd ../../../..

3. Build v3d-core

   npm install
   npm run build

   Output files will be under dist folder.

Debugging

Go to root folder of this repository and run:

$ npm run debug

The debug page can be opened in any browser with http://localhost:8080/.

Demo Video

See this demo video.

Credits

• babylon-vrm-loader
• babylon-mtoon-material

Licenses

see LICENSE.

Babylon.js is licensed under Apache License 2.0.

Git Submodule

• git submodule init
• git submodule sync
• git submodule update --remote
• git submodule status

Git Submodule Remove

1. git submodule deinit <your_submodule>
2. rm -rf <your_submodule>
3. git rm <your_submodule>
4. git commit -m "Removed submodule"
5. rm -rf .git/modules/<your_submodule>

For babylon-mtoon-material debugging with es6 option

• Patch material-value-binding-merger.ts and vrm-material-generator.ts file in babylon-vrm-loader package.
• copy shader/babylon-mtoon-material/src/shaders to dist/src/babylon-mtoon-material/src