JSPM

  • Created
  • Published
  • Downloads 3581
  • Score
    100M100P100Q128150F
  • License MIT

Projections (2.5d and bilinear) for pixi v^4

Package Exports

  • pixi-projection

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (pixi-projection) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

pixi-projection

Build Status

Collection of projections, both 2d and 3d.

There are many ways to define projections even when we are using only 2 dimensions.

Two-point projections in 2d are good for parallax.

Done:

  • Projective 2d transform
  • Projective 2d quad mapping
  • Bilinear 2d quad mapping
  • Option to "drop" projection and go back to PIXI.Matrix in a child

Backlog:

  • Projective 2d by euler angles

To-do:

  • Docs

Examples

Projective sprites: Container2d, Sprite2d, Text2d

Two-point projection One-point with return to affine Projective transform of quad

Surface sprites: Container2s, Sprite2s, Text2s for now only bilinear

Bilinear transform of quad

Usage

convert existing elements

Same can be applied to Container2s. You cant use both projective and surface sprites

var sprite = new PIXI.Sprite();
sprite.convertTo2d();
sprite.proj; //available now!

var container = new PIXI.Container();
container.convertTo2d();
sprite.proj; //available now!

var tree = new PIXI.Container();
var child = new PIXI.Container();
tree.addChild(child);
tree.convertSubtreeTo2d(tree);
child.proj; //available now!

Building

You will need to have node setup on your machine.

Make sure you have yarn installed:

npm install -g yarn

Then you can install dependencies and build:

yarn
yarn build

That will output the built distributables to ./bin.