Pixi Test

by yasumodev

JavaScript

var width = 320;    // 描画エリアのサイズ
var height = 240;
var params = {
  backgroundColor: 0xffff00   // 背景色の指定（灰色）
};
var renderer = PIXI.autoDetectRenderer(width, height, params);  // レンダラー生成

// DOM操作にjQueryを使用するので事前に読み込んでおくこと
document.body.append(renderer.view);    // DOMにレンダラーのビューを追加

var stage = new PIXI.Container();   // ステージを生成
renderer.render(stage);     // レンダラーにステージを描画させる


// テキストスタイル
var style = new PIXI.TextStyle({
    fontSize: 80,
    fontWeight: "bold",
    fill: 0xff0000,
});
// テキストからスプライトを生成
var sprite = new PIXI.Text("ABC", style);
sprite.anchor.set(0.5);     // 基準点をスプライトの中心にセットする
sprite.x = width / 2;       // スプライトの座標をステージの中心にする
sprite.y = height / 2;

stage.addChild(sprite);     // スプライトをステージに追加

renderer.render(stage);　　// ステージ描画