This set of HTML test focuses on “Client-Side Graphics with Canvas”.
1. Which of the following element is used for canvas graphics?
a) <paint> b) <canvas> c) <graphic> d) <css>
Explanation: CSS i.e. Cascading Style Sheet is a scripting language. Canvas graphics is introduced in HTML5. Element used for canvas graphics is <canvas>. 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) SVG doesn’t support event handlers
View Answer
Explanation: SVG stands for “Scalable Vector Graphics”, it is used to draw graphics for the web. W3C recommends SVG graphics. SVG also supports event handlers which is not supported in canvas.
3. To draw on the canvas, authors must first obtain a reference to a context using the ______________ method of the canvas interface element.
a) getImageData
b) toDataURL
c) getContext
d) restore
View Answer
Explanation: The method getImageData(), returns an imageData that copies pixel data for a specified thing in canvas. 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) skew(x,y)
View Answer
Explanation: HTML5 canvas provides scale(x, y) method which is used to increase or decrease the units in our canvas grid. The position (0, 0) is remaped in canvas by translate(x, y) method. If one want to rotate the current drawing then rotate(angle) method can be used.
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) removeRect(x,y,w,h)
View Answer
Explanation: StrokeRect(x, y, w, h) draws rectangle without filling it. The clearRect() method clears the specified pixels within a given rectangle. FillRect(x, y, w, h) method draws filled 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) setImage()
View Answer
Explanation: The width of specified text present in an object is given by measureText() method. The drawImage() method draws an image, canvas, or video onto the canvas. ImageData() method provides image data in pixels in 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) get()
View Answer
Explanation: The path one defines is drawn by stroke() method. Any region/shape or size in canvas is clipped by clip(). The fill() method fills the current drawing (path). The default color is black. There is no method like get().
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) get()
View Answer
Explanation: The path one defines is drawn by stroke() method. Any region/shape or size in canvas is clipped by clip(). The fill() method fills the current drawing (path). The default color is black. There is no method like get().
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) endPath()
View Answer
Explanation: ClosePath() creates a path that starts from current point up to the starting point. The beginPath() method begins a path, or resets the current path. MoveTo(x, y) moves the point specified in canvas but without creating the line. There is nothing like endPath() in canvas.
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
View Answer
Explanation: API, an abbreviation of application program interface, is a set of routines, protocols, and tools for building software applications. API allow the author/owner to get or set data or execute commands to the user agent.
Sanfoundry Global Education & Learning Series – HTML.
To practice all areas of HTML for tests, here is complete set of 1000+ Multiple Choice Questions and Answers.