All credits [so far] go to Shadowstep33/Angular2Pixi

Everything here is copied from their repository and made to work with PIXI 5 and Angular 8.

Create PIXI scenes in Angular 2 with markup! Make sure to check out the wiki for more information on usage. There is also a repo with working demos found at: https://github.com/Shadowstep33/a2p-demos

Install

npm install --save angular2pixi

Dependencies

A2P has two main dependencies that should automatically be installed

• GSAP
• PIXI.js

Getting Started

Include the module in your app

import {PixiModule}

@NgModule({
	...
	
  imports: [
	PixiModule
	]
	
	...

And voila, you should now have access to the module!

A2P contains a few basic components:

• sprites: extendable component used to create PIXI.Sprites and support animations and interactions
• text: similar to the sprite component, but uses PIXI.Text instead
• filters: allows you to add effects to Containers

and a few services

• pixi: gives access to pixi itself and initializes your Pixi workspace
• asset: load up assets and do stuff when they're ready

Simple Example

<sprite
	[x]="w * 0.5"
	[y]="h * 0.6"
	imgUrl="./assets/demo/person.png"
	*ngIf="homeScene"
	scale="1"
	[container]="homeScene.layers.hud"
></sprite>

Please refer to the wiki for more details.