Awesome Open Source
Awesome Open Source

pixi-live2d

Display live2D model as a sprite in pixi.js.


Installation | Example | API | License | Donation

Pixi-live2d is a plugin for pixi.js for displaying live2D model as a sprite in pixi.js.

Installation

npm install pixi-live2d

Attention

Because of the SDK policy of Live2D Inc., SDK file has been removed from the package, so you have to download and import it by yourself.

for example in HTML file:

<script src="live2d.min.js"></script>

or just require it

require('live2d.min.js');

Example

import PIXI from 'pixi.js';
import 'pixi-live2d';

const renderer = new PIXI.WebGLRenderer(800, 600);
document.body.appendChild(renderer.view);
const stage = new PIXI.Container();

const live2dSprite = new PIXI.Live2DSprite(modelHaru);
stage.addChild(live2dSprite);

live2dSprite.startRandomMotion('idle');
live2dSprite.on('mousemove', (evt) => {
  const point = evt.data.global;
  live2dSprite.setViewPoint(point.x, point.y);
});

function animate() {
    requestAnimationFrame(animate);
    renderer.render(stage);
}
animate();

You can find a more complex one at example folder, or visit it online.

API

docs/API.md

License

This plugin is distributed under MIT license, and you should agree with the licenses of Live2D and pixi.js.

For more detail, please read LICENSE.txt.

Donation

The plugin is free for charge, if you like it don't forget to buy me a coffee!

ko-fi:
Buy Me a Coffee at ko-fi.com

alipay:


Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
javascript (68,103
pixijs (29
live2d (26
pixi (20

Find Open Source By Browsing 7,000 Topics Across 59 Categories