Node's Pretty Magical

    babylon-vrm-loader
    TypeScript icon, indicating that this package has built-in type declarations

    1.6.0 • Public • Published

    babylon-vrm-loader

    npm version CircleCI semantic-release

    alicia.png

    VRM porting to babylon.js.

    This loader is used as THE SEED ONLINE web VRM/VCI/glb viewer.

    Supported version table

    babylon.js version babylon-vrm-loader version
    ~4.1.0 <1.5.0
    ~4.2.0 ^1.5.0
    ~5.0.0 unreleased(will be ^1.6.0)

    Features

    • Supports .vrm file loading
      • with extensions.VRM glTF Extension
    • Supports .vci file loading
    • Supports MToonMaterial
    • Get bone(TransformNode) from Unity Humanoid bone mapping name
    • BlendShape morphing
    • Secondary Animation
    • Supports VCI features(partial support)
      • VCAST_vci_material_unity
      • TODO: VCAST_vci_meta
      • TODO: VCAST_vci_embedded_script
      • TODO: VCAST_vci_audios
      • TODO: VCAST_vci_colliders
      • TODO: VCAST_vci_rigidbody
      • TODO: VCAST_vci_joints
      • TODO: VCAST_vci_item

    Usage

    on browser

    example is here.

    on Babylon.js Playgound

    example is here.

    with npm/yarn

    $ npm install --save @babylonjs/core @babylonjs/loaders babylon-vrm-loader
    # or
    $ yarn add @babylonjs/core @babylonjs/loaders babylon-vrm-loader
    import * as BABYLON from '@babylonjs/core'
    
    // has side-effect
    // ref. https://webpack.js.org/guides/tree-shaking#mark-the-file-as-side-effect-free
    import 'babylon-vrm-loader'
    
    // vrmFile is File object retrieved by <input type="file">.
    const scene = await BABYLON.SceneLoader.LoadAsync('file:', vrmFile, engine);
    const vrmManager = scene.metadata.vrmManagers[0];
    
    // Update secondary animation
    scene.onBeforeRenderObservable.add(() => {
        vrmManager.update(scene.getEngine().getDeltaTime());
    });
    
    // Model Transformation
    vrmManager.rootMesh.translate(new BABYLON.Vector3(1, 0, 0), 1);
    
    // Work with HumanoidBone
    vrmManager.humanoidBone.leftUpperArm.addRotation(0, 1, 0);
    
    // Work with BlendShape(MorphTarget)
    vrmManager.morphing('Joy', 1.0);

    Contributing

    See CONTRIBUTING.md.

    Build

    $ yarn build

    Debugging MToonMaterial

    $ yarn debug

    You can see inspector on http://localhost:8080/

    Related Links

    Licenses

    see LICENSE.

    This project uses babylon.js with Apache License, Version 2.0.

    Install

    npm i babylon-vrm-loader

    DownloadsWeekly Downloads

    70

    Version

    1.6.0

    License

    MIT

    Unpacked Size

    266 kB

    Total Files

    25

    Last publish

    Collaborators

    • yamagishi.iloop