pixijs-scene-graphics

A reference for drawing vector shapes and paths in PixiJS v8 through the Graphics API, the vector-drawing leaf of the v8 scene graph. The v8 API follows a shape-then-style pattern: draw a shape or path with methods like rect, circle, or moveTo, then apply fill and/or stroke. Every method returns 'this' for chaining, and the underlying drawing instructions live on a GraphicsContext that can be shared between instances to reuse tessellated geometry and avoid duplicate GPU work. Because Graphics is a leaf, it should not contain children - multiple Graphics objects are grouped inside a Container.

Use it when rendering vector graphics: basic shapes (rect, circle, ellipse, poly, roundRect, star) and advanced primitives (regularPoly, roundPoly, chamferRect, filletRect, roundShape), as well as path construction with moveTo, lineTo, bezierCurveTo, quadraticCurveTo, and arc-family methods. Fills accept a FillInput - a color, an options object, a FillGradient (linear or radial), a FillPattern, or a Texture - with textureSpace controlling whether a texture maps to each shape's bounding box ('local') or the Graphics object's coordinate system ('global'). Strokes accept a StrokeStyle combining fill keys with attributes such as width, cap, join, miterLimit, alignment, and pixelLine, and can themselves use gradients or patterns.

The skill covers holes via cut(), which subtracts the current active path from the previously drawn fill or stroke; the hole must sit completely inside the target shape, cut() looks back at up to the last two instructions, and multiple shapes can be accumulated into a single cut() call. Constructor options include a shared context and roundPixels, and all Container options (position, scale, tint, filters, zIndex, and more) remain valid. Additional topics named include svg import/export via graphicsContextToSvg, containsPoint hit testing, cloning, clearing, bounds, draw-time transforms (rotateTransform, scaleTransform, translateTransform, setTransform, save/restore), default fill and stroke styles, and GraphicsPath reuse. It assumes familiarity with pixijs-scene-core-concepts and cross-references related skills for masking, filters, and performance.