Geometry and Mathematics
/SKILLUse this skill when working with Phaser 4's mathematical and geometric tools. It covers vectors, rectangles, and
--- name: geometry-and-math description: "Use this skill when using Phaser 4 math and geometry utilities. Covers vectors, rectangles, circles, triangles, polygons, random number generation, angles, distance, interpolation, and snapping. Triggers on: Vector2, Rectangle, Circle, math, distance, angle, random, lerp." --- # Phaser 4 : Geometry and Math > Geom classes (Circle, Ellipse, Line, Polygon, Rectangle, Triangle), intersection tests, and Math utilities (Vector2, Vector3, Matrix4, angles, distances, interpolation, easing, random, snap, clamp). Related skills: graphics-and-shapes.md, physics-arcade.md --- ## Quick Start ``js // Create geometry objects (these are data only, not renderable) const rect = new Phaser.Geom.Rectangle(10, 20, 200, 100); const circle = new Phaser.Geom.Circle(400, 300, 50); const line = new Phaser.Geom.Line(0, 0, 100, 100); // Point containment rect.contains(50, 50); // true circle.contains(410, 310); // true // Intersection test Phaser.Geom.Intersects.CircleToRectangle(circle, rect); // boolean // Math utilities const v = new Phaser.Math.Vector2(3, 4); v.length(); // 5 v.normalize(); // {x: 0.6, y: 0.8} const dist = Phaser.Math.Distance.Between(0, 0, 100, 100); const angle = Phaser.Math.Angle.Between(0, 0, 100, 100); const clamped = Phaser.Math.Clamp(150, 0, 100); // 100 ` --- ## Core Concepts Geometry objects are pure data containers holding coordinates and dimensions. They are NOT game objects and cannot be added to the display list. To render geometry, use the Graphics game object or Shape game objects (see graphics-and-shapes.md). Every geom class has a type property set to a Phaser.Geom constant for fast type checks. All geom classes share a common instance method pattern: - contains(x, y) -- point-in-shape test - getPoint(position, output?) -- point at normalized position (0-1) on perimeter - getPoints(quantity, stepRate?, output?) -- evenly spaced points on perimeter - getRandomPoint(output?) -- random point inside the shape - setTo(...) -- reset all properties - setEmpty() -- zero out the shape - setPosition(x, y) -- move origin/center Each geom type also has a folder of static helper functions (e.g., Phaser.Geom.Rectangle.Contains, Phaser.Geom.Circle.Area). --- ## Geometry Classes | Class | Namespace | Constructor | Key Properties | |---|---|---|---| | **Circle** | Phaser.Geom.Circle | (x, y, radius) | x, y, radius, diameter, left, right, top, bottom | | **Ellipse** | Phaser.Geom.Ellipse | (x, y, width, height) | x, y, width, height, left, right, top, bottom | | **Line** | Phaser.Geom.Line | (x1, y1, x2, y2) | x1, y1, x2, y2, left, right, top, bottom | | **Polygon** | Phaser.Geom.Polygon | (points) | area, points (array of Vector2Like) | | **Rectangle** | Phaser.Geom.Rectangle | (x, y, width, height) | x, y, width, height, left, right, top, bottom, centerX, centerY | | **Triangle** | Phaser.Geom.Triangle | (x1, y1, x2, y2, x3, y3) | x1, y1, x2, y2, x3, y3 | ### Rectangle Static Helpers Phaser.Geom.Rectangle.*: Area, Ceil, CeilAll, CenterOn, Clone, Contains, ContainsPoint, ContainsRect, CopyFrom, Decompose, Equals, FitInside, FitOutside, Floor, FloorAll, FromPoints, FromXY, GetAspectRatio, GetCenter, GetPoint, GetPoints, GetSize, Inflate, Intersection, MarchingAnts, MergePoints, MergeRect, MergeXY, Offset, OffsetPoint, Overlaps, Perimeter, PerimeterPoint, Random, RandomOutside, SameDimensions, Scale, Union. ### Circle Static Helpers Phaser.Geom.Circle.*: Area, Circumference, CircumferencePoint, Clone, Contains, ContainsPoint, ContainsRect, CopyFrom, Equals, GetBounds, GetPoint, GetPoints, Offset, OffsetPoint, Random. ### Line Static Helpers Phaser.Geom.Line.*: Angle, BresenhamPoints, CenterOn, Clone, CopyFrom, Equals, Extend, GetEasedPoints, GetMidPoint, GetNearestPoint, GetNormal, GetPoint, GetPoints, GetShortestDistance, Height, Length, NormalAngle, NormalX, NormalY, Offset, PerpSlope, Random, ReflectAngle, Rotate, RotateAroundPoint, RotateAroundXY, SetToAngle, Slope, Width. ### Triangle Static Helpers Phaser.Geom.Triangle.*: Area, BuildEquilateral, BuildFromPolygon, BuildRight, CenterOn, Centroid, CircumCenter, CircumCircle, Clone, Contains, ContainsArray, ContainsPoint, CopyFrom, Decompose, Equals, GetPoint, GetPoints, InCenter, Offset, Perimeter, Random, Rotate, RotateAroundPoint, RotateAroundXY. ### Polygon Input Formats The Polygon constructor accepts multiple formats for the points argument: - Space-separated string: '40 0 40 20 100 20 100 80' - Array of {x, y} objects - Flat number array: [x1, y1, x2, y2, ...] - Array of [x, y] sub-arrays --- ## Intersection Tests All under Phaser.Geom.Intersects. ### Boolean Tests (return true/false) | Function | Description | |---|---| | CircleToCircle(circleA, circleB) | Two circles overlap | | CircleToRectangle(circle, rect)` |