2014-02-27 86 views
15

[Chrome v32]用pixi.js绘制一个矩形

如何用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); 

错误:

Uncaught TypeError: Object [object Object] has no method 'setStageReference'

回答

7

Geometries are not renderable, they are for doing geometric calculations.

Source @xerver

所以我们必须使用PIXI.Graphics()

31

现在可以参见提供的链接:http://www.goodboydigital.com/pixi-webgl-primitives/

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);