arcade2d
Class

PolygonGraphics

graphics/polygon-graphics.ts:38

Extends AbstractGraphics<PixiGraphics>

Renders a filled Polygon attached to a WorldObject. The polygon's vertices are interpreted in the host's local space: vertex (0, 0) is the host's position, and the polygon rotates and scales with the host because the underlying display object's transform is driven by AbstractGraphics.

Two static helpers — PolygonGraphics.asRectangle and PolygonGraphics.asLine — produce the two shapes that come up most often (a centered rectangle and an oriented line segment) without forcing the caller to build the vertex list by hand.

Example

import { Polygon, PolygonGraphics } from '@arcade2d/engine';

// Custom polygon from explicit vertices.
const triangle = new Polygon([
  { x: 0, y: -10 },
  { x: 10, y: 10 },
  { x: -10, y: 10 },
]);
new PolygonGraphics(object, triangle, 0x44ccff);

// Centered rectangle convenience helper.
PolygonGraphics.asRectangle(object, 32, 32, 0xffaa00);

// Oriented line as a thin rectangle polygon.
PolygonGraphics.asLine(object, { x: 0, y: 0 }, { x: 50, y: 20 }, 2);

Constructors

#
constructor(host: WorldObject, polygon: Polygon, fill: number): PolygonGraphics

Parameters

Properties

#
enabled: boolean

Per-component gate on the three update hooks (onPreUpdate, onUpdate, onPostUpdate). When explicitly false, the engine skips all three for this component during the host's tick — useful for temporarily pausing behaviour (e.g. a freeze powerup) without removing the component and losing its internal state.

Does not gate onAdded or onDestroy; those always fire so a host can never end up with a half-attached component.

readonly #
host: WorldObject

The host this component is attached to. Stored read-only; subclasses access it as this.host directly, or through the tier-appropriate aliases (this.world, this.game) on the per-tier abstract bases.

readonly #
polygon: Polygon

The polygon shape to draw. Stored as-is for inspection. Polygons with fewer than three vertices produce no draw output.

Accessors

readonly #
game: Game

The Game the host's world belongs to. Always non-null — the world's game field is a mandatory construction argument, not an option.

readonly #
raw: T

Direct access to the underlying Pixi display object.

Use with care. raw is an intentional escape hatch for cases the arcade2d API doesn't cover — custom shaders, filter chains, advanced blend modes, mask assignment, world-space bounds queries, anything we haven't decided how to model yet. Code that touches raw is coupled to Pixi's public API and may break when:

  • arcade2d upgrades Pixi (including minor versions).
  • Pixi itself ships a breaking change.
  • arcade2d swaps Pixi for a different renderer.

None of those will be treated as breaking changes to arcade2d's own surface. Prefer the typed methods on this component; reach for raw only when no equivalent exists, and isolate the access behind your own helper so the coupling is in one place.

readonly #
world: World

The World the host WorldObject lives in. Shorthand for this.host.world.

Methods

#
containsWorldPoint(point: PointPrimitive): boolean

Returns true if the given world-space point lies inside this polygon, accounting for the host's position, rotation, and scale. Composes WorldObject.worldToLocal with the underlying Polygon.containsPoint ray-cast so callers don't have to manage the inverse transform themselves.

This is the typed replacement for reaching at .raw.getBounds().containsPoint(...): the Pixi bounds query returns post-transform (screen-space) extents, so it silently disagrees with world coordinates the moment the camera moves, scales, or rotates. Use this method instead.

Parameters

Returns

boolean

Example

// Bullet hit-test against any enemy whose polygon body contains the
// bullet's world position.
for (const enemy of world.findByTag('enemy')) {
  const body = enemy.getComponentByType(PolygonGraphics);
  if (body.containsWorldPoint(bullet.position)) {
    enemy.destroy();
    bullet.destroy();
    break;
  }
}
#
onAdded(): void

Lifecycle hook that is called when the component is added to the host object. Should not be called directly.

Returns

void
#
onDestroy(): void

Lifecycle hook that is called when the host object is destroyed. Should not be called directly.

Returns

void
#
onPostUpdate(): void

Returns

void
#
onUpdate(_update: WorldUpdate, _deps: Record): void

Lifecycle hook for the main update phase. Called once per world tick, after every component's onPreUpdate and before any onPostUpdate.

Parameters

Returns

void
static #
asLine(host: WorldObject, from: PointPrimitive, to: PointPrimitive, thickness: number, fill: number): PolygonGraphics

Constructs a PolygonGraphics representing a line segment drawn as a thin oriented rectangle. The line runs from from to to (both in the host's local space) and is thickness units wide perpendicular to that direction.

A zero-length segment produces an empty polygon — the component will still attach and tick, but it draws nothing until the caller produces a fresh instance with a non-degenerate segment.

Parameters

Returns

PolygonGraphics
static #
asRectangle(host: WorldObject, width: number, height: number, fill: number): PolygonGraphics

Constructs a PolygonGraphics representing a rectangle centered on the host's local origin. Useful for the common "draw a box at this object's position" case where the caller doesn't want to build the vertex list themselves.

Note that the rectangle this produces differs from the geometry shape — the geometry Rectangle is top-left anchored, but here vertices are emitted centered on (0, 0) so the visual sits on top of the host position rather than offset down-right of it.

Parameters

  • host WorldObject
  • width number
  • height number
  • fill number

Returns

PolygonGraphics
ESC