pixijs_quickstart_graphics_rectangle_drawing_with_fill_and_stroke.ts

1import { Application, Graphics } from 'pixi.js';
2
3(async () =>
4{
5    // Create a new application
6    const app = new Application();
7
8    // Initialize the application
9    await app.init({ background: '#1099bb', resizeTo: window });
10
11    // Append the application canvas to the document body
12    document.body.appendChild(app.canvas);
13
14    // Create a new Graphics object
15    const graphics = new Graphics();
16
17    // Rectangle
18    graphics.rect(50, 50, 100, 100);
19    graphics.fill(0xde3249);
20    graphics.stroke({ width: 2, color: 0xfeeb77 });
21
22    // Add the graphics to the stage
23    app.stage.addChild(graphics);
24})();