pixi.js
Version:
<p align="center"> <a href="https://pixijs.com" target="_blank" rel="noopener noreferrer"> <img height="150" src="https://files.pixijs.download/branding/pixijs-logo-transparent-dark.svg?v=1" alt="PixiJS logo"> </a> </p> <br/> <p align="center">
200 lines (196 loc) • 6.23 kB
JavaScript
'use strict';
var Rectangle = require('./Rectangle.js');
"use strict";
class Circle {
/**
* @param x - The X coordinate of the center of this circle
* @param y - The Y coordinate of the center of this circle
* @param radius - The radius of the circle
*/
constructor(x = 0, y = 0, radius = 0) {
/**
* The type of the object, mainly used to avoid `instanceof` checks.
* @example
* ```ts
* // Check shape type
* const shape = new Circle(0, 0, 50);
* console.log(shape.type); // 'circle'
*
* // Use in type guards
* if (shape.type === 'circle') {
* console.log(shape.radius);
* }
* ```
* @remarks
* - Used for shape type checking
* - More efficient than instanceof
* - Read-only property
* @readonly
* @default 'circle'
* @see {@link SHAPE_PRIMITIVE} For all shape types
* @see {@link ShapePrimitive} For shape interface
*/
this.type = "circle";
this.x = x;
this.y = y;
this.radius = radius;
}
/**
* Creates a clone of this Circle instance.
* @example
* ```ts
* // Basic circle cloning
* const original = new Circle(100, 100, 50);
* const copy = original.clone();
*
* // Clone and modify
* const modified = original.clone();
* modified.radius = 75;
*
* // Verify independence
* console.log(original.radius); // 50
* console.log(modified.radius); // 75
* ```
* @returns A copy of the Circle
* @see {@link Circle.copyFrom} For copying into existing circle
* @see {@link Circle.copyTo} For copying to another circle
*/
clone() {
return new Circle(this.x, this.y, this.radius);
}
/**
* Checks whether the x and y coordinates given are contained within this circle.
*
* Uses the distance formula to determine if a point is inside the circle's radius.
*
* Commonly used for hit testing in PixiJS events and graphics.
* @example
* ```ts
* // Basic containment check
* const circle = new Circle(100, 100, 50);
* const isInside = circle.contains(120, 120);
*
* // Check mouse position
* const circle = new Circle(0, 0, 100);
* container.hitArea = circle;
* container.on('pointermove', (e) => {
* // only called if pointer is within circle
* });
* ```
* @param x - The X coordinate of the point to test
* @param y - The Y coordinate of the point to test
* @returns Whether the x/y coordinates are within this Circle
* @see {@link Circle.strokeContains} For checking stroke intersection
* @see {@link Circle.getBounds} For getting bounding box
*/
contains(x, y) {
if (this.radius <= 0)
return false;
const r2 = this.radius * this.radius;
let dx = this.x - x;
let dy = this.y - y;
dx *= dx;
dy *= dy;
return dx + dy <= r2;
}
/**
* Checks whether the x and y coordinates given are contained within this circle including the stroke.
* @example
* ```ts
* // Basic stroke check
* const circle = new Circle(100, 100, 50);
* const isOnStroke = circle.strokeContains(150, 100, 4); // 4px line width
*
* // Check with different alignments
* const innerStroke = circle.strokeContains(150, 100, 4, 0); // Inside
* const centerStroke = circle.strokeContains(150, 100, 4, 0.5); // Centered
* const outerStroke = circle.strokeContains(150, 100, 4, 1); // Outside
* ```
* @param x - The X coordinate of the point to test
* @param y - The Y coordinate of the point to test
* @param width - The width of the line to check
* @param alignment - The alignment of the stroke, 0.5 by default
* @returns Whether the x/y coordinates are within this Circle's stroke
* @see {@link Circle.contains} For checking fill containment
* @see {@link Circle.getBounds} For getting stroke bounds
*/
strokeContains(x, y, width, alignment = 0.5) {
if (this.radius === 0)
return false;
const dx = this.x - x;
const dy = this.y - y;
const radius = this.radius;
const outerWidth = (1 - alignment) * width;
const distance = Math.sqrt(dx * dx + dy * dy);
return distance <= radius + outerWidth && distance > radius - (width - outerWidth);
}
/**
* Returns the framing rectangle of the circle as a Rectangle object.
* @example
* ```ts
* // Basic bounds calculation
* const circle = new Circle(100, 100, 50);
* const bounds = circle.getBounds();
* // bounds: x=50, y=50, width=100, height=100
*
* // Reuse existing rectangle
* const rect = new Rectangle();
* circle.getBounds(rect);
* ```
* @param out - Optional Rectangle object to store the result
* @returns The framing rectangle
* @see {@link Rectangle} For rectangle properties
* @see {@link Circle.contains} For point containment
*/
getBounds(out) {
out || (out = new Rectangle.Rectangle());
out.x = this.x - this.radius;
out.y = this.y - this.radius;
out.width = this.radius * 2;
out.height = this.radius * 2;
return out;
}
/**
* Copies another circle to this one.
* @example
* ```ts
* // Basic copying
* const source = new Circle(100, 100, 50);
* const target = new Circle();
* target.copyFrom(source);
* ```
* @param circle - The circle to copy from
* @returns Returns itself
* @see {@link Circle.copyTo} For copying to another circle
* @see {@link Circle.clone} For creating new circle copy
*/
copyFrom(circle) {
this.x = circle.x;
this.y = circle.y;
this.radius = circle.radius;
return this;
}
/**
* Copies this circle to another one.
* @example
* ```ts
* // Basic copying
* const source = new Circle(100, 100, 50);
* const target = new Circle();
* source.copyTo(target);
* ```
* @param circle - The circle to copy to
* @returns Returns given parameter
* @see {@link Circle.copyFrom} For copying from another circle
* @see {@link Circle.clone} For creating new circle copy
*/
copyTo(circle) {
circle.copyFrom(this);
return circle;
}
toString() {
return `[pixi.js/math:Circle x=${this.x} y=${this.y} radius=${this.radius}]`;
}
}
exports.Circle = Circle;
//# sourceMappingURL=Circle.js.map