4.12.9 • Public • Published

    PISI — canvas graphics rendering library for node.js

    pisi logo

    PISI is a lightweight node.js canvas graphics animation library. It forks from the famous canvas engine pixi.js. It can run almost all the code of pixi.js on the node side and save pictures. You can use it to do server-side image synthesis. Pisi uses version 4.8.9 of pixi.js, because this is a very stable and easily expandable version.

    PISI has a lot of performance optimization and code refactoring. One of its application Demo is FFCreator https://github.com/tnfe/FFCreator video processing library.

    Current features

    • WebGL renderer (headless-gl)
    • Canvas renderer (node-canvas)
    • Super easy to use API
    • Support for texture atlases
    • Asset loader / sprite sheet loader
    • Support multiple text effects
    • Various Sprite effects and animations
    • Masking and Filters

    Basic Usage

    npm install pisi
    const fs = require("fs-extra");
    const { Application, Sprite, Ticker, loader } = require("pisi");
    const app = new Application();
    loader.add("bunny", "bunny.png").load(loaded);
    function loaded(loader, resources) {
      const bunny = new Sprite(resources.bunny.texture);
      bunny.x = app.renderer.width / 2;
      bunny.y = app.renderer.height / 2;
    const ticker = new Ticker();
    ticker.add(() => {
      // The render function must be called in the loop (different from pixi.js)
    // save image
    const buffer = app.view.toBuffer("image/png");
    fs.outputFile("hello.png", buffer);

    Save Image

    Pisi supports saving pictures in multiple formats, you can refer to the api of node-canvas https://github.com/Automattic/node-canvas#canvastobuffer. You can save any animated graphics supported by the browser on the server side.


    1. Install node-canvas and headless-gl dependencies

    If it is a computer with a display device, such as a personal pc computer with windows, Mac OSX system, or a server server with a graphics card or display device, you can skip this step without installing this dependency.

    If you are using Centos, Redhat, Fedora system, you can use yum to install.

    sudo yum install gcc-c++ cairo-devel pango-devel libjpeg-turbo-devel giflib-devel

    InstallXvfb and Mesa

    sudo yum install mesa-dri-drivers Xvfb libXi-devel libXinerama-devel libX11-devel

    If you are using Debian, ubuntu system, you can use apt to install.

    sudo apt-get install libcairo2-dev libjpeg-dev libpango1.0-dev libgif-dev build-essential g++
    sudo apt-get install libgl1-mesa-dev xvfb libxi-dev libx11-dev

    2. Because FFCreator depends on FFmpeg, you need to install a regular version of FFmpeg

    For a more detailed tutorial, please check here

    Start Up

    If it is a computer with a display device, such as a personal pc computer or a server server with a graphics card or display device, start normally npm start

    Otherwise, You must use the xvfb-run script command to start the program to use webgl under the Linux server

    xvfb-run more detailed command parameters http://manpages.ubuntu.com/manpages/xenial/man1/xvfb-run.1.html

    xvfb-run -s "-ac -screen 0 1280x1024x24" npm start

    How to build

    Note that for most users you don't need to build this project. If all you want is to use PISI, then just download one of our prebuilt releases. Really the only time you should need to build PISI is if you are developing it.

    If you don't already have Node.js and NPM, go install them. Then, in the folder where you have cloned the repository, install the build dependencies using npm:

    npm install

    Then, to build the source, run:

    npm run dist

    This will create a minified version at dist/pisi.min.js and a non-minified version at dist/pisi with all the plugins in the PISI project.

    If there are specific plugins you don't want, say "interaction" or "extras", you can exclude those:

    npm run dist -- --exclude extras --exclude interaction

    You can also use the short-form -e:

    npm run dist -- -e extras -e interaction -e filters


    This content is released under the (http://opensource.org/licenses/MIT) MIT License.




    npm i pisi

    DownloadsWeekly Downloads






    Unpacked Size

    1.42 MB

    Total Files


    Last publish


    • ajiemath