PixiJS Library (#27412)
* PixiJS library * missing extension * Rename guide/english/canvas/PixiJS.md to guide/english/canvas/pixi-js/index.md * fix: added frontmatterpull/34721/head
parent
793cbcf789
commit
cf6251816b
|
@ -0,0 +1,42 @@
|
|||
---
|
||||
title: PixiJS
|
||||
---
|
||||
|
||||
## PixiJS
|
||||
|
||||
# Introduction
|
||||
|
||||
Pixi.js is an open source, cross browser JavaScript 2D WebGL graphics library with canvas fallback.
|
||||
|
||||
# Example 1
|
||||
|
||||
The rotating bunny
|
||||
|
||||
```
|
||||
var app = new PIXI.Application(800, 600, {backgroundColor : 0x1099bb});
|
||||
document.body.appendChild(app.view);
|
||||
|
||||
// create a new Sprite from an image path
|
||||
var bunny = PIXI.Sprite.fromImage('required/assets/basics/bunny.png')
|
||||
|
||||
// center the sprite's anchor point
|
||||
bunny.anchor.set(0.5);
|
||||
|
||||
// move the sprite to the center of the screen
|
||||
bunny.x = app.screen.width / 2;
|
||||
bunny.y = app.screen.height / 2;
|
||||
|
||||
app.stage.addChild(bunny);
|
||||
|
||||
// Listen for animate update
|
||||
app.ticker.add(function(delta) {
|
||||
// just for fun, let's rotate mr rabbit a little
|
||||
// delta is 1 if running at 100% performance
|
||||
// creates frame-independent transformation
|
||||
bunny.rotation += 0.1 * delta;
|
||||
});
|
||||
|
||||
```
|
||||
|
||||
|
||||
You can find this running example here: http://pixijs.io/examples/index.html#/basics/basic.js
|
Loading…
Reference in New Issue