Interface OffscreenCanvasRenderingContext2D

interface OffscreenCanvasRenderingContext2D {
    canvas: OffscreenCanvas;
    direction: CanvasDirection;
    fillStyle: string | CanvasGradient | CanvasPattern;
    filter: string;
    font: string;
    fontKerning: CanvasFontKerning;
    globalAlpha: number;
    globalCompositeOperation: GlobalCompositeOperation;
    imageSmoothingEnabled: boolean;
    imageSmoothingQuality: ImageSmoothingQuality;
    lineCap: CanvasLineCap;
    lineDashOffset: number;
    lineJoin: CanvasLineJoin;
    lineWidth: number;
    miterLimit: number;
    shadowBlur: number;
    shadowColor: string;
    shadowOffsetX: number;
    shadowOffsetY: number;
    strokeStyle: string | CanvasGradient | CanvasPattern;
    textAlign: CanvasTextAlign;
    textBaseline: CanvasTextBaseline;
    arc(x: number, y: number, radius: number, startAngle: number, endAngle: number, counterclockwise?: boolean): void;
    arcTo(x1: number, y1: number, x2: number, y2: number, radius: number): void;
    beginPath(): void;
    bezierCurveTo(cp1x: number, cp1y: number, cp2x: number, cp2y: number, x: number, y: number): void;
    clearRect(x: number, y: number, w: number, h: number): void;
    clip(fillRule?: CanvasFillRule): void;
    clip(path: Path2D, fillRule?: CanvasFillRule): void;
    closePath(): void;
    commit(): void;
    createConicGradient(startAngle: number, x: number, y: number): CanvasGradient;
    createImageData(sw: number, sh: number, settings?: ImageDataSettings): ImageData;
    createImageData(imagedata: ImageData): ImageData;
    createLinearGradient(x0: number, y0: number, x1: number, y1: number): CanvasGradient;
    createPattern(image: CanvasImageSource, repetition: null | string): null | CanvasPattern;
    createRadialGradient(x0: number, y0: number, r0: number, x1: number, y1: number, r1: number): CanvasGradient;
    drawImage(image: CanvasImageSource, dx: number, dy: number): void;
    drawImage(image: CanvasImageSource, dx: number, dy: number, dw: number, dh: number): void;
    drawImage(image: CanvasImageSource, sx: number, sy: number, sw: number, sh: number, dx: number, dy: number, dw: number, dh: number): void;
    ellipse(x: number, y: number, radiusX: number, radiusY: number, rotation: number, startAngle: number, endAngle: number, counterclockwise?: boolean): void;
    fill(fillRule?: CanvasFillRule): void;
    fill(path: Path2D, fillRule?: CanvasFillRule): void;
    fillRect(x: number, y: number, w: number, h: number): void;
    fillText(text: string, x: number, y: number, maxWidth?: number): void;
    getImageData(sx: number, sy: number, sw: number, sh: number, settings?: ImageDataSettings): ImageData;
    getLineDash(): number[];
    getTransform(): DOMMatrix;
    isPointInPath(x: number, y: number, fillRule?: CanvasFillRule): boolean;
    isPointInPath(path: Path2D, x: number, y: number, fillRule?: CanvasFillRule): boolean;
    isPointInStroke(x: number, y: number): boolean;
    isPointInStroke(path: Path2D, x: number, y: number): boolean;
    lineTo(x: number, y: number): void;
    measureText(text: string): TextMetrics;
    moveTo(x: number, y: number): void;
    putImageData(imagedata: ImageData, dx: number, dy: number): void;
    putImageData(imagedata: ImageData, dx: number, dy: number, dirtyX: number, dirtyY: number, dirtyWidth: number, dirtyHeight: number): void;
    quadraticCurveTo(cpx: number, cpy: number, x: number, y: number): void;
    rect(x: number, y: number, w: number, h: number): void;
    resetTransform(): void;
    restore(): void;
    rotate(angle: number): void;
    roundRect(x: number, y: number, w: number, h: number, radii?: number | DOMPointInit | (number | DOMPointInit)[]): void;
    roundRect(x: number, y: number, w: number, h: number, radii?: number | DOMPointInit | Iterable<number | DOMPointInit>): void;
    save(): void;
    scale(x: number, y: number): void;
    setLineDash(segments: number[]): void;
    setLineDash(segments: Iterable<number>): void;
    setTransform(a: number, b: number, c: number, d: number, e: number, f: number): void;
    setTransform(transform?: DOMMatrix2DInit): void;
    stroke(): void;
    stroke(path: Path2D): void;
    strokeRect(x: number, y: number, w: number, h: number): void;
    strokeText(text: string, x: number, y: number, maxWidth?: number): void;
    transform(a: number, b: number, c: number, d: number, e: number, f: number): void;
    translate(x: number, y: number): void;
}

Hierarchy (view full)

Properties

canvas direction fillStyle filter font fontKerning globalAlpha globalCompositeOperation imageSmoothingEnabled imageSmoothingQuality lineCap lineDashOffset lineJoin lineWidth miterLimit shadowBlur shadowColor shadowOffsetX shadowOffsetY strokeStyle textAlign textBaseline

Methods

arc arcTo beginPath bezierCurveTo clearRect clip closePath commit createConicGradient createImageData createLinearGradient createPattern createRadialGradient drawImage ellipse fill fillRect fillText getImageData getLineDash getTransform isPointInPath isPointInStroke lineTo measureText moveTo putImageData quadraticCurveTo rect resetTransform restore rotate roundRect save scale setLineDash setTransform stroke strokeRect strokeText transform translate

Properties

Readonlycanvas

canvas: OffscreenCanvas

direction

direction: CanvasDirection

fillStyle

fillStyle: string | CanvasGradient | CanvasPattern

filter

filter: string

font

font: string

fontKerning

fontKerning: CanvasFontKerning

globalAlpha

globalAlpha: number

globalCompositeOperation

globalCompositeOperation: GlobalCompositeOperation

imageSmoothingEnabled

imageSmoothingEnabled: boolean

imageSmoothingQuality

imageSmoothingQuality: ImageSmoothingQuality

lineCap

lineCap: CanvasLineCap

lineDashOffset

lineDashOffset: number

lineJoin

lineJoin: CanvasLineJoin

lineWidth

lineWidth: number

miterLimit

miterLimit: number

shadowBlur

shadowBlur: number

shadowColor

shadowColor: string

shadowOffsetX

shadowOffsetX: number

shadowOffsetY

shadowOffsetY: number

strokeStyle

strokeStyle: string | CanvasGradient | CanvasPattern

textAlign

textAlign: CanvasTextAlign

textBaseline

textBaseline: CanvasTextBaseline

Methods

arc

  • arc(x, y, radius, startAngle, endAngle, counterclockwise?): void

  • Parameters

    • x: number
    • y: number
    • radius: number
    • startAngle: number
    • endAngle: number
    • Optionalcounterclockwise: boolean

    Returns void

arcTo

  • arcTo(x1, y1, x2, y2, radius): void

  • Parameters

    • x1: number
    • y1: number
    • x2: number
    • y2: number
    • radius: number

    Returns void

beginPath

  • beginPath(): void

  • Returns void

bezierCurveTo

  • bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y): void

  • Parameters

    • cp1x: number
    • cp1y: number
    • cp2x: number
    • cp2y: number
    • x: number
    • y: number

    Returns void

clearRect

  • clearRect(x, y, w, h): void

  • Parameters

    • x: number
    • y: number
    • w: number
    • h: number

    Returns void

clip

closePath

  • closePath(): void

  • Returns void

commit

  • commit(): void

  • Returns void

createConicGradient

createImageData

createLinearGradient

createPattern

createRadialGradient

drawImage

  • drawImage(image, dx, dy): void

  • Parameters

    Returns void

  • drawImage(image, dx, dy, dw, dh): void

  • Parameters

    Returns void

  • drawImage(image, sx, sy, sw, sh, dx, dy, dw, dh): void

  • Parameters

    • image: CanvasImageSource
    • sx: number
    • sy: number
    • sw: number
    • sh: number
    • dx: number
    • dy: number
    • dw: number
    • dh: number

    Returns void

ellipse

  • ellipse(x, y, radiusX, radiusY, rotation, startAngle, endAngle, counterclockwise?): void

  • Parameters

    • x: number
    • y: number
    • radiusX: number
    • radiusY: number
    • rotation: number
    • startAngle: number
    • endAngle: number
    • Optionalcounterclockwise: boolean

    Returns void

fill

fillRect

  • fillRect(x, y, w, h): void

  • Parameters

    • x: number
    • y: number
    • w: number
    • h: number

    Returns void

fillText

  • fillText(text, x, y, maxWidth?): void

  • Parameters

    • text: string
    • x: number
    • y: number
    • OptionalmaxWidth: number

    Returns void

getImageData

getLineDash

  • getLineDash(): number[]

  • Returns number[]

getTransform

isPointInPath

  • isPointInPath(x, y, fillRule?): boolean

  • Parameters

    Returns boolean

  • isPointInPath(path, x, y, fillRule?): boolean

  • Parameters

    Returns boolean

isPointInStroke

  • isPointInStroke(x, y): boolean

  • Parameters

    • x: number
    • y: number

    Returns boolean

  • isPointInStroke(path, x, y): boolean

  • Parameters

    • path: Path2D
    • x: number
    • y: number

    Returns boolean

lineTo

  • lineTo(x, y): void

  • Parameters

    • x: number
    • y: number

    Returns void

measureText

moveTo

  • moveTo(x, y): void

  • Parameters

    • x: number
    • y: number

    Returns void

putImageData

  • putImageData(imagedata, dx, dy): void

  • Parameters

    Returns void

  • putImageData(imagedata, dx, dy, dirtyX, dirtyY, dirtyWidth, dirtyHeight): void

  • Parameters

    • imagedata: ImageData
    • dx: number
    • dy: number
    • dirtyX: number
    • dirtyY: number
    • dirtyWidth: number
    • dirtyHeight: number

    Returns void

quadraticCurveTo

  • quadraticCurveTo(cpx, cpy, x, y): void

  • Parameters

    • cpx: number
    • cpy: number
    • x: number
    • y: number

    Returns void

rect

  • rect(x, y, w, h): void

  • Parameters

    • x: number
    • y: number
    • w: number
    • h: number

    Returns void

resetTransform

restore

  • restore(): void

  • Returns void

rotate

  • rotate(angle): void

  • Parameters

    • angle: number

    Returns void

roundRect

  • roundRect(x, y, w, h, radii?): void

  • Parameters

    Returns void

  • roundRect(x, y, w, h, radii?): void

  • Parameters

    Returns void

save

  • save(): void

  • Returns void

scale

  • scale(x, y): void

  • Parameters

    • x: number
    • y: number

    Returns void

setLineDash

  • setLineDash(segments): void

  • Parameters

    • segments: number[]

    Returns void

  • setLineDash(segments): void

  • Parameters

    Returns void

setTransform

  • setTransform(a, b, c, d, e, f): void

  • Parameters

    • a: number
    • b: number
    • c: number
    • d: number
    • e: number
    • f: number

    Returns void

  • setTransform(transform?): void

  • Parameters

    Returns void

stroke

  • stroke(): void

  • Returns void

  • stroke(path): void

  • Parameters

    Returns void

strokeRect

  • strokeRect(x, y, w, h): void

  • Parameters

    • x: number
    • y: number
    • w: number
    • h: number

    Returns void

strokeText

  • strokeText(text, x, y, maxWidth?): void

  • Parameters

    • text: string
    • x: number
    • y: number
    • OptionalmaxWidth: number

    Returns void

transform

  • transform(a, b, c, d, e, f): void

  • Parameters

    • a: number
    • b: number
    • c: number
    • d: number
    • e: number
    • f: number

    Returns void

translate

  • translate(x, y): void

  • Parameters

    • x: number
    • y: number

    Returns void

Settings

Member Visibility

On This Page

Properties
Methods