Drawing Text

Drawing Text

To draw a Text on a Canvas a user can use number of methods to make it attractive. All the methods are discussed below.

Let us discuss the Method used in Text Drawing on a Canvas

Text Drawing Methods

There are 3 types of methods which are used in Text Drawing:-
FillText
StrokeText
Measure Text

 

Text Drawing Method: fillText (“text”, x, y, width)

The first method used to draw text on canvas is with fillText (“text”, x, y, width) method.

Here,
“text” represents the text to be drawn on Canvas.

( x, y ) represents the co-ordinates where text drawing starts.

Width represents the max-width of the text in px, but it is optional.
Code

 

 

Text Drawing Method: strokeText (“text”, x, y, width)

The second method used to draw text on the canvas is with strokeText (“text”, x, y, width) method. This method strokes the outline of the text.

 

 

Text Dimensions Measure: measureText (text)

The third method used to calculate the width of span that the text occupies is with measureText (text) method. Basically in this, the text string that is to be measured is taken as a parameter by the method. It measures the length and returns the value which can be displayed on the canvas.