HTML Multiple Choice Questions & Answers on Client-Side Graphics with Canvas for Freshers

1. Which of the following element is used for canvas graphics?

a) 
b) <canvas>
c) 
d) 

Answer: b

Explanation: The HTML canvas element is used to draw graphics, on the fly, via scripting (usually JavaScript).

 
 

2. Which of the following statement is not true?

a) SVG stands for Scalable Vector Graphics
b) SVG is used to define graphics for the Web
c) SVG is a W3C recommendation
d) All of the mentioned

Answer: d

Explanation: All the statements regarding SVG are true.

3. To draw on the canvas, authors must first obtain a reference to a context using the ______________ method of the canvas interface element.

a) getData
b) toDataURL
c) getContext
d) none of the mentioned

Answer: c

Explanation: contextType is a DOMString containing the context identifier defining the drawing context associated to the canvas.

4. The ___________ method must add the scaling transformation described by the arguments to the transformation matrix.

a) scale(x, y)
b) translate(x, y)
c) rotate(angle)
d) none of the mentioned

Answer: a

Explanation: HTML5 canvas provides scale(x, y) method which is used to increase or decrease the units in our canvas grid.

5. Which method must clear the pixels in the specified rectangle that also intersects the current clipping region to a fully transparent black, erasing any previous image?

a) strokeRect(x, y, w, h)
b) clearRect(x, y, w, h)
c) fillRect(x, y, w, h)
d) none of the mentioned

Answer: b

Explanation: The clearRect() method clears the specified pixels within a given rectangle.

6. When the _____________ method is passed an animated image as its image argument, the user agent must use the poster frame of the animation, or, if there is no poster frame, the first frame of the animation.

a) measureText()
b) imageData()
c) drawImage()
d) none of the mentioned

Answer: c

Explanation: The drawImage() method draws an image, canvas, or video onto the canvas.

7. The ____________ method must create a new clipping region by calculating the intersection of the current clipping region and the area described by the current path, using the non-zero winding number rule.

a) fill()
b) stroke()
c) clip()
d) none of the mentioned

Answer: c

Explanation: The clip() method clips a region of any shape and size from the original canvas.

8. The ____________ method must fill all the subpaths of the current path, using fillStyle, and using the non-zero winding number rule.

a) fill()
b) stroke()
c) clip()
d) none of the mentioned

Answer: a

Explanation: The fill() method fills the current drawing (path).The default color is black.

9. Which of the following methods must empty the list of subpaths so that the context once again has zero subpaths?

a) closePath()
b) beginPath()
c) moveTo(x, y)
d) none of the mentioned

Answer: b

Explanation: The beginPath() method begins a path, or resets the current path.

10. An API is an application programming interface consisting of methods and properties which allow the author to get or set data or execute commands to the user agent.

a) True
b) False

Answer: a

Explanation: API, an abbreviation of application program interface, is a set of routines, protocols, and tools for building software applications.