UNPKG

@avolutions/canvas-painter

Version:

CanvasPainter.js is a simple yet powerful JavaScript library for drawing basic shapes (rectangles, circles, etc.) on HTML5 Canvas with ease. Perfect for creating 2D graphics in your web projects.

87 lines (86 loc) 3.25 kB
import { CircleDefinition } from "../definitions/CircleDefinition.js"; import { CircleOptions } from "../options/CircleOptions.js"; import { ICircleOptions } from "../options/interfaces/ICircleOptions.js"; import { CircleStyle } from "../styles/CircleStyle.js"; import { ICircleStyle } from "../styles/interfaces/ICircleStyle.js"; import { Point } from "../types/Point.js"; import { Shape } from "./Shape.js"; /** * Class representing a circle, extending the Shape class with a CircleDefinition. * Provides functionality for rendering, resizing and moving the circle. */ export declare class Circle extends Shape<CircleDefinition, CircleStyle, CircleOptions> { /** * @param center - The center `Point` of the circle. * @param radius - The radius of the circle. * @param style - Defines the styling of the circle. * @param options - The configuration options for the circle. */ constructor(center: Point, radius: number, style?: ICircleStyle, options?: ICircleOptions); /** * @param centerX - The X-coordinate of the starting point. * @param centerY - The Y-coordinate of the starting point. * @param radius - The radius of the circle. * @param style - Defines the styling of the circle. * @param options - The configuration options for the circle. */ constructor(centerX: number, centerY: number, radius: number, style?: ICircleStyle, options?: ICircleOptions); /** * Gets the center point of the circle. * * @returns The center point of the circle. */ get center(): Point; /** * Gets the radius of the circle. * * @returns The radius of the circle. */ get radius(): number; /** * Sets the center point of the circle. * * @param center - The new center point of the circle. */ set center(center: Point); /** * Sets the radius of the circle. * * @param radius - The new radius of the circle. */ set radius(radius: number); /** * Moves the circle by adjusting the current center by delta values. * * @param deltaX - The change in the x-coordinate. * @param deltaY - The change in the y-coordinate. */ move(deltaX?: number, deltaY?: number): void; /** * Resizes the circle by adjusting the current radius by delta values. * * @param delta - The change of the radius. */ resize(delta: number): void; /** * Renders the circle on the canvas using the provided 2D rendering context. * * The circle will be rendered with its current position and radius size. * * @param context - The 2D rendering context of the canvas where the circle will be drawn. */ render(context: CanvasRenderingContext2D): void; /** * Determines if the mouse is currently over the shape. * * @param mousePosition - The current mouse position. * @returns True if the mouse is over the shape, false otherwise. */ isMouseOver(mousePosition: Point): boolean; /** * Handles the drag operation by applying the given delta to the current position. * * @param delta - The change in position represented as a `Point`. */ onDrag(delta: Point): void; }