Pixi.js超快的 HTML5 2D 渲染引擎

PixiJS 提供一個適用于所有設備的快速輕量級2D庫。 PixiJS 渲染器允許每個人在不事先了解WebGL的情況下享受硬件加速的強大功能。 而且它很快、真的很快，適合創(chuàng)建豐富的交互式圖形，跨平臺應用程序和游戲。

PixiJS具有完整的WebGL支持，并且可以無縫地回退到 HTML5 的畫布。 作為一個框架，PixiJS是用于創(chuàng)作交互式內(nèi)容的絕佳工具，尤其是近年來遠離Adobe Flash。 將它用于圖形豐富的交互式網(wǎng)站，應用程序和HTML5游戲。 開箱即用的跨平臺兼容性和優(yōu)雅的降級意味著您可以減少工作量并享受更多樂趣！ 如果你想要相對快速地創(chuàng)建精美和精致的體驗，而不是深入研究密集的低級代碼，同時避免瀏覽器不一致的麻煩，那么請將你的下一個項目用一些PixiJS魔法！

基本使用示例：

// The application will create a renderer using WebGL, if possible,
// with a fallback to a canvas render. It will also setup the ticker
// and the root stage PIXI.Container
const app = new PIXI.Application();

// The application will create a canvas element for you that you
// can then insert into the DOM
document.body.appendChild(app.view);

// load the texture we need
app.loader.add('bunny', 'bunny.png').load((loader, resources) => {
    // This creates a texture from a 'bunny.png' image
    const bunny = new PIXI.Sprite(resources.bunny.texture);

    // Setup the position of the bunny
    bunny.x = app.renderer.width / 2;
    bunny.y = app.renderer.height / 2;

    // Rotate around the center
    bunny.anchor.x = 0.5;
    bunny.anchor.y = 0.5;

    // Add the bunny to the scene we are building
    app.stage.addChild(bunny);

    // Listen for frame updates
    app.ticker.add(() => {
         // each frame we spin the bunny around a bit
        bunny.rotation += 0.01;
    });
});

下面是一些在線的演示：

• Filters Demo
• Run Pixie Run
• Flash vs HTML
• Bunny Demo
• Storm Brewing
• Render Texture Demo
• Primitives Demo
• Masking Demo
• Interaction Demo
• photonstorm's Balls Demo
• photonstorm's Morph Demo

更多實例請看 http://pixijs.github.io/examples/