Interface CanvasRenderingContext2D

Hierarchy

CanvasCompositing
CanvasDrawImage
CanvasDrawPath
CanvasFillStrokeStyles
CanvasFilters
CanvasImageData
CanvasImageSmoothing
CanvasPath
CanvasPathDrawingStyles
CanvasRect
CanvasShadowStyles
CanvasState
CanvasText
CanvasTextDrawingStyles
CanvasTransform
CanvasUserInterface
- CanvasRenderingContext2D

Properties

`Readonly` canvas

canvas: HTMLCanvasElement

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
MDN Reference
Parameters
- x: number
- y: number
- radius: number
- startAngle: number
- endAngle: number
- Optional counterclockwise: boolean
Returns void

Inherited from CanvasPath.arc

arcTo

arcTo(x1, y1, x2, y2, radius): void
MDN Reference
Parameters
- x1: number
- y1: number
- x2: number
- y2: number
- radius: number
Returns void

Inherited from CanvasPath.arcTo

beginPath

beginPath(): void
MDN Reference

Returns void

Inherited from CanvasDrawPath.beginPath

bezierCurveTo

bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y): void
MDN Reference
Parameters
- cp1x: number
- cp1y: number
- cp2x: number
- cp2y: number
- x: number
- y: number
Returns void

Inherited from CanvasPath.bezierCurveTo

clearRect

clearRect(x, y, w, h): void
MDN Reference
Parameters
- x: number
- y: number
- w: number
- h: number
Returns void

Inherited from CanvasRect.clearRect

clip

clip(fillRule?): void
MDN Reference
Parameters
- Optional fillRule: CanvasFillRule
Returns void

Inherited from CanvasDrawPath.clip
clip(path, fillRule?): void
Parameters
- path: Path2D
- Optional fillRule: CanvasFillRule
Returns void

Inherited from CanvasDrawPath.clip

closePath

closePath(): void
MDN Reference

Returns void

Inherited from CanvasPath.closePath

createConicGradient

createConicGradient(startAngle, x, y): CanvasGradient
MDN Reference
Parameters
- startAngle: number
- x: number
- y: number
Returns CanvasGradient

Inherited from CanvasFillStrokeStyles.createConicGradient

createImageData

createImageData(sw, sh, settings?): ImageData
MDN Reference
Parameters
- sw: number
- sh: number
- Optional settings: ImageDataSettings
Returns ImageData

Inherited from CanvasImageData.createImageData
createImageData(imagedata): ImageData
Parameters
- imagedata: ImageData
Returns ImageData

Inherited from CanvasImageData.createImageData

createLinearGradient

createLinearGradient(x0, y0, x1, y1): CanvasGradient
MDN Reference
Parameters
- x0: number
- y0: number
- x1: number
- y1: number
Returns CanvasGradient

Inherited from CanvasFillStrokeStyles.createLinearGradient

createPattern

createPattern(image, repetition): CanvasPattern
MDN Reference
Parameters
- image: CanvasImageSourceWebCodecs
- repetition: string
Returns CanvasPattern

Overrides CanvasFillStrokeStyles.createPattern

createRadialGradient

createRadialGradient(x0, y0, r0, x1, y1, r1): CanvasGradient
MDN Reference
Parameters
- x0: number
- y0: number
- r0: number
- x1: number
- y1: number
- r1: number
Returns CanvasGradient

Inherited from CanvasFillStrokeStyles.createRadialGradient

drawFocusIfNeeded

drawFocusIfNeeded(element): void
MDN Reference
Parameters
- element: Element
Returns void

Inherited from CanvasUserInterface.drawFocusIfNeeded
drawFocusIfNeeded(path, element): void
Parameters
- path: Path2D
- element: Element
Returns void

Inherited from CanvasUserInterface.drawFocusIfNeeded

drawImage

drawImage(image, dx, dy): void
MDN Reference
Parameters
- image: CanvasImageSourceWebCodecs
- dx: number
- dy: number
Returns void

Overrides CanvasDrawImage.drawImage
drawImage(image, dx, dy, dw, dh): void
Parameters
- image: CanvasImageSourceWebCodecs
- dx: number
- dy: number
- dw: number
- dh: number
Returns void

Overrides CanvasDrawImage.drawImage
drawImage(image, sx, sy, sw, sh, dx, dy, dw, dh): void
Parameters
- image: CanvasImageSourceWebCodecs
- sx: number
- sy: number
- sw: number
- sh: number
- dx: number
- dy: number
- dw: number
- dh: number
Returns void

Overrides CanvasDrawImage.drawImage

ellipse

ellipse(x, y, radiusX, radiusY, rotation, startAngle, endAngle, counterclockwise?): void
MDN Reference
Parameters
- x: number
- y: number
- radiusX: number
- radiusY: number
- rotation: number
- startAngle: number
- endAngle: number
- Optional counterclockwise: boolean
Returns void

Inherited from CanvasPath.ellipse

fill

fill(fillRule?): void
MDN Reference
Parameters
- Optional fillRule: CanvasFillRule
Returns void

Inherited from CanvasDrawPath.fill
fill(path, fillRule?): void
Parameters
- path: Path2D
- Optional fillRule: CanvasFillRule
Returns void

Inherited from CanvasDrawPath.fill

fillRect

fillRect(x, y, w, h): void
MDN Reference
Parameters
- x: number
- y: number
- w: number
- h: number
Returns void

Inherited from CanvasRect.fillRect

fillText

fillText(text, x, y, maxWidth?): void
MDN Reference
Parameters
- text: string
- x: number
- y: number
- Optional maxWidth: number
Returns void

Inherited from CanvasText.fillText

getContextAttributes

getContextAttributes(): CanvasRenderingContext2DSettings
MDN Reference

Returns CanvasRenderingContext2DSettings

getImageData

getImageData(sx, sy, sw, sh, settings?): ImageData
MDN Reference
Parameters
- sx: number
- sy: number
- sw: number
- sh: number
- Optional settings: ImageDataSettings
Returns ImageData

Inherited from CanvasImageData.getImageData

getLineDash

getLineDash(): number[]
MDN Reference

Returns number[]

Inherited from CanvasPathDrawingStyles.getLineDash

getTransform

getTransform(): DOMMatrix
MDN Reference

Returns DOMMatrix

Inherited from CanvasTransform.getTransform

isPointInPath

isPointInPath(x, y, fillRule?): boolean
MDN Reference
Parameters
- x: number
- y: number
- Optional fillRule: CanvasFillRule
Returns boolean

Inherited from CanvasDrawPath.isPointInPath
isPointInPath(path, x, y, fillRule?): boolean
Parameters
- path: Path2D
- x: number
- y: number
- Optional fillRule: CanvasFillRule
Returns boolean

Inherited from CanvasDrawPath.isPointInPath

isPointInStroke

isPointInStroke(x, y): boolean
MDN Reference
Parameters
- x: number
- y: number
Returns boolean

Inherited from CanvasDrawPath.isPointInStroke
isPointInStroke(path, x, y): boolean
Parameters
- path: Path2D
- x: number
- y: number
Returns boolean

Inherited from CanvasDrawPath.isPointInStroke

lineTo

lineTo(x, y): void
MDN Reference
Parameters
- x: number
- y: number
Returns void

Inherited from CanvasPath.lineTo

measureText

measureText(text): TextMetrics
MDN Reference
Parameters
- text: string
Returns TextMetrics

Inherited from CanvasText.measureText

moveTo

moveTo(x, y): void
MDN Reference
Parameters
- x: number
- y: number
Returns void

Inherited from CanvasPath.moveTo

putImageData

putImageData(imagedata, dx, dy): void
MDN Reference
Parameters
- imagedata: ImageData
- dx: number
- dy: number
Returns void

Inherited from CanvasImageData.putImageData
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

Inherited from CanvasImageData.putImageData

quadraticCurveTo

quadraticCurveTo(cpx, cpy, x, y): void
MDN Reference
Parameters
- cpx: number
- cpy: number
- x: number
- y: number
Returns void

Inherited from CanvasPath.quadraticCurveTo

rect

rect(x, y, w, h): void
MDN Reference
Parameters
- x: number
- y: number
- w: number
- h: number
Returns void

Inherited from CanvasPath.rect

resetTransform

resetTransform(): void
MDN Reference

Returns void

Inherited from CanvasTransform.resetTransform

restore

restore(): void
MDN Reference

Returns void

Inherited from CanvasState.restore

rotate

rotate(angle): void
MDN Reference
Parameters
- angle: number
Returns void

Inherited from CanvasTransform.rotate

roundRect

roundRect(x, y, w, h, radii?): void
MDN Reference
Parameters
- x: number
- y: number
- w: number
- h: number
- Optional radii: number | DOMPointInit | (number | DOMPointInit)[]
Returns void

Inherited from CanvasPath.roundRect
roundRect(x, y, w, h, radii?): void
MDN Reference
Parameters
- x: number
- y: number
- w: number
- h: number
- Optional radii: number | DOMPointInit | Iterable<number | DOMPointInit>
Returns void

Inherited from CanvasPath.roundRect

save

save(): void
MDN Reference

Returns void

Inherited from CanvasState.save

scale

scale(x, y): void
MDN Reference
Parameters
- x: number
- y: number
Returns void

Inherited from CanvasTransform.scale

setLineDash

setLineDash(segments): void
MDN Reference
Parameters
- segments: number[]
Returns void

Inherited from CanvasPathDrawingStyles.setLineDash
setLineDash(segments): void
MDN Reference
Parameters
- segments: Iterable<number>
Returns void

Inherited from CanvasPathDrawingStyles.setLineDash

setTransform

setTransform(a, b, c, d, e, f): void
MDN Reference
Parameters
- a: number
- b: number
- c: number
- d: number
- e: number
- f: number
Returns void

Inherited from CanvasTransform.setTransform
setTransform(transform?): void
Parameters
- Optional transform: DOMMatrix2DInit
Returns void

Inherited from CanvasTransform.setTransform

stroke

stroke(): void
MDN Reference

Returns void

Inherited from CanvasDrawPath.stroke
stroke(path): void
Parameters
- path: Path2D
Returns void

Inherited from CanvasDrawPath.stroke

strokeRect

strokeRect(x, y, w, h): void
MDN Reference
Parameters
- x: number
- y: number
- w: number
- h: number
Returns void

Inherited from CanvasRect.strokeRect

strokeText

strokeText(text, x, y, maxWidth?): void
MDN Reference
Parameters
- text: string
- x: number
- y: number
- Optional maxWidth: number
Returns void

Inherited from CanvasText.strokeText

transform

transform(a, b, c, d, e, f): void
MDN Reference
Parameters
- a: number
- b: number
- c: number
- d: number
- e: number
- f: number
Returns void

Inherited from CanvasTransform.transform

translate

translate(x, y): void
MDN Reference
Parameters
- x: number
- y: number
Returns void

Inherited from CanvasTransform.translate