Canvas Reference

Question 1

fillStyle

Answer 1

Sets or returns the color, gradient, or pattern used to fill the drawing

Question 2

strokeStyle

Answer 2

Sets or returns the color, gradient, or pattern used for strokes

Question 3

shadowColor

Answer 3

Sets or returns the color to use for shadows

Question 4

shadowBlur

Answer 4

Sets or returns the blur level for shadows

Question 5

shadowOffsetX

Answer 5

Sets or returns the horizontal distance of the shadow from the shape

Question 6

shadowOffsetY

Answer 6

Sets or returns the vertical distance of the shadow from the shape

Question 7

createLinearGradient()

Answer 7

Creates a linear gradient (to use on canvas content)

Question 8

createPattern()

Answer 8

Repeats a specified element in the specified direction

Question 9

createRadialGradient()

Answer 9

Creates a radial/circular gradient (to use on canvas content)

Question 10

addColorStop()

Answer 10

Specifies the colors and stop positions in a gradient object

Question 11

lineCap

Answer 11

Sets or returns the style of the end caps for a line

Question 12

lineJoin

Answer 12

Sets or returns the type of corner created, when two lines meet

Question 13

lineWidth

Answer 13

Sets or returns the current line width

Question 14

miterLimit

Answer 14

Sets or returns the maximum miter length

Question 15

rect()

Answer 15

Creates a rectangle

Question 16

fillRect()

Answer 16

Draws a “filled” rectangle

Question 17

strokeRect()

Answer 17

Draws a rectangle (no fill)

Question 18

clearRect()

Answer 18

Clears the specified pixels within a given rectangle

Question 19

fill()

Answer 19

Fills the current drawing (path)

Question 20

stroke()

Answer 20

Actually draws the path you have defined

Question 21

beginPath()

Answer 21

Begins a path, or resets the current path

Question 22

mclip()

Answer 22

Moves the path to the specified point in the canvas, without creating a line

Question 23

closePath()

Answer 23

Creates a path from the current point back to the starting point

Question 24

lineTo()

Answer 24

Adds a new point and creates a line from that point to the last specified point in the canvas

Question 25

clip()

Answer 25

Clips a region of any shape and size from the original canvas

Question 26

quadraticCurveTo()

Answer 26

Creates a quadratic Bézier curve

Question 27

bezierCurveTo()

Answer 27

Creates a cubic Bézier curve

Question 28

arc()

Answer 28

Creates an arc/curve (used to create circles, or parts of circles)

Question 29

arcTo()

Answer 29

Creates an arc/curve between two tangents

Question 30

isPointInPath()

Answer 30

Returns true if the specified point is in the current path, otherwise false

Question 31

scale()

Answer 31

Scales the current drawing bigger or smaller

Question 32

rotate()

Answer 32

Rotates the current drawing

Question 33

translate()

Answer 33

Remaps the (0,0) position on the canvas

Question 34

transform()

Answer 34

Replaces the current transformation matrix for the drawing

Question 35

setTransform()

Answer 35

Resets the current transform to the identity matrix. Then runs transform()

Question 36

font

Answer 36

Sets or returns the current font properties for text content

Question 37

textAlign

Answer 37

Sets or returns the current alignment for text content

Question 38

textBaseline

Answer 38

Sets or returns the current text baseline used when drawing text

Question 39

fillText()

Answer 39

Draws "filled" text on the canvas

Question 40

strokeText()

Answer 40

Draws text on the canvas (no fill)

Question 41

measureText()

Answer 41

Returns an object that contains the width of the specified text

Question 42

drawImage()

Answer 42

Draws an image, canvas, or video onto the canvas

Question 43

width

Answer 43

Returns the width of an ImageData object

Question 44

height

Answer 44

Returns the height of an ImageData object

Question 45

data

Answer 45

Returns an object that contains image data of a specified ImageData object

Question 46

createImageData()

Answer 46

Creates a new, blank ImageData object

Question 47

getImageData()

Answer 47

Returns an ImageData object that copies the pixel data for the specified rectangle on a canvas

Question 48

putImageData()

Answer 48

Puts the image data (from a specified ImageData object) back onto the canvas

Question 49

globalAlpha

Answer 49

Sets or returns the current alpha or transparency value of the drawing

Question 50

globalCompositeOperation

Answer 50

Sets or returns how a new image are drawn onto an existing image

Question 51

save()

Answer 51

Saves the state of the current context

Question 52

restore()

Answer 52

Returns previously saved path state and attributes