How to convert a graphic to a sprite in pixijs

Question

Is there a way to convert a graphic to a sprite? I have a graphic containing a single rectangle, and would like to convert it to a sprite to enable complex animations.

I have tried doing

let p= new Graphics();
p.beginFill(0x000000);
p.lineStyle(0);
p.drawCircle(100, 100, 10);
p.endFill();

const t = RenderTexture.create(p.width, p.height);
renderer.render(p, t);

const sprite = new Sprite(t);

However this is not working.

score 13 · Accepted Answer · answered Mar 27 '19 at 16:46

13

var gr = new PIXI.Graphics();  
        gr.beginFill(0xFFFFFF);
        gr.lineStyle(0);
        gr.drawCircle(30, 30, 30);
        gr.endFill();

var texture = renderer.generateTexture(gr);
var circle = new PIXI.Sprite(texture);

app.stage.addChild(circle);

answered Mar 27 '19 at 16:46

Aivaras

156
3
7

6

What is renderer? I'm having the same issue but my class don't know what renderer is – nammerkage Apr 29 '20 at 13:56
4

The renderer is a prop of the app variable – Kitanga Nday Jun 05 '20 at 07:43

How to convert a graphic to a sprite in pixijs

1 Answers1

Linked