[Chrome v32]
如何使用PIXI.js库绘制基本的RED矩形?
我试过这个(不工作)
var stage = new PIXI.Stage(0xFFFFFF);
var renderer = PIXI.autoDetectRenderer(400, 300);
document.body.appendChild(renderer.view);
renderer.render(stage);
var rect = new PIXI.Rectangle(100, 150, 50, 50);
stage.addChild(rect);
错误:
未捕获TypeError:对象[object Object]没有方法 'setStageReference'
答案 0 :(得分:42)
您无法渲染几何体(Pixi.Rectangle
),它们仅用于计算。您可以改为:
var graphics = new PIXI.Graphics();
graphics.beginFill(0xFFFF00);
// set the line style to have a width of 5 and set the color to red
graphics.lineStyle(5, 0xFF0000);
// draw a rectangle
graphics.drawRect(0, 0, 300, 200);
stage.addChild(graphics);
答案 1 :(得分:10)
答案 2 :(得分:4)
使用PIXI.Texture.WHITE有一种不错的方法。
const rectangle = PIXI.Sprite.from(PIXI.Texture.WHITE);
rectangle.width = 300;
rectangle.height = 200;
rectangle.tint = 0xFF0000;
stage.addChild(rectangle);