Rahul Gurung

Rahul Gurung

490 Articles Published

Articles by Rahul Gurung

Page 17 of 49

How to center a Text object horizontally on canvas using FabricJS?

Rahul Gurung
Rahul Gurung
Updated on 13-Sep-2022 1K+ Views

In this tutorial, we are going to learn how to center a Text horizontally on canvas using FabricJS. We can display text on canvas by adding an instance of fabric.Text. Not only does it allow us to move, scale and change the dimensions of the text but it also provides additional functionality like text alignment, text decoration, line height which can be obtained by the properties textAlign, underline and lineHeight respectively. We can also center the text object horizontally on the canvas by using the centerH method. Syntax centerH() Example 1 Default appearance of the Text object Let’s see ...

Read More

How to center a Text object horizontally and vertically on canvas using FabricJS?

Rahul Gurung
Rahul Gurung
Updated on 13-Sep-2022 460 Views

In this tutorial, we are going to learn how to center a Text horizontally and vertically on canvas using FabricJS. We can display text on canvas by adding an instance of fabric.Text. Not only does it allow us to move, scale and change the dimensions of the text but it also provides additional functionality like text alignment, text decoration, line height which can be obtained by the properties textAlign, underline and lineHeight respectively. We can also center the text object horizontally and vertically on the canvas by using the center method. Syntax center() Example 1 Default appearance of the ...

Read More

How to add underline to Text using FabricJS?

Rahul Gurung
Rahul Gurung
Updated on 13-Sep-2022 728 Views

In this tutorial, we are going to learn how to add underline to Text using FabricJS. We can display text on canvas by adding an instance of fabric.Text. Not only does it allow us to move, scale and change the dimensions of the text but it also provides additional functionality like text alignment, text decoration overline, line height which can be obtained by the properties textAlign, overline and lineHeight respectively. Similarly we can also add underline to text by using the underline property. Syntax new fabric.Text(text: String , { underline: Boolean }: Object) Parameters text − This parameter ...

Read More

How to add superscript with Text using FabricJS?

Rahul Gurung
Rahul Gurung
Updated on 13-Sep-2022 332 Views

In this tutorial, we are going to learn how to add superscript with Text using FabricJS. We can display text on canvas by adding an instance of fabric.Text. Not only does it allow us to move, scale and change the dimensions of the text but it also provides additional functionality like text alignment, text decoration, line height which can be obtained by the properties textAlign, underline and lineHeight respectively. We can also add superscripts by using the setSuperscript method. Syntax setSuperscript(start: Number, end: Number) Parameters start − This parameter accepts a Number as value. The value given determines ...

Read More

How to add subscript with Text using FabricJS?

Rahul Gurung
Rahul Gurung
Updated on 13-Sep-2022 305 Views

In this tutorial, we are going to learn how to add subscript with Text using FabricJS. We can display text on canvas by adding an instance of fabric.Text. Not only does it allow us to move, scale and change the dimensions of the text but it also provides additional functionality like text alignment, text decoration, line height which can be obtained by the properties textAlign, underline and lineHeight respectively. We can also add subscripts by using the setSubscript method. Syntax setSubscript(start: Number, end: Number) Parameters start − This parameter accepts a Number as value. The value given determines ...

Read More

How to add stroke to Text using FabricJS?

Rahul Gurung
Rahul Gurung
Updated on 13-Sep-2022 367 Views

In this tutorial, we are going to learn how to add stroke to Text using FabricJS. We can display text on canvas by adding an instance of fabric.Text. Not only does it allow us to move, scale and change the dimensions of the text but it also provides additional functionality like text alignment, text decoration, line height which can be obtained by the properties textAlign, underline and lineHeight respectively. We can add stroke by using the stroke property. Syntax new fabric.Text(text: String, { stroke: String }: Object) Parameters text − This parameter accepts a String which is the ...

Read More

How to add space between characters in Text using FabricJS?

Rahul Gurung
Rahul Gurung
Updated on 13-Sep-2022 501 Views

In this tutorial, we are going to learn about how to add space between characters in a Text object using FabricJS. We can display text on canvas by adding an instance of fabric.Text. Not only does it allow us to move, scale and change the dimensions of the text but it also provides additional functionality like text alignment, text decoration, line height which can be obtained by the properties textAlign, underline and lineHeight respectively. We can also add extra space between each character by using the charSpacing property. Syntax new fabric.Text(text: String , { charSpacing: Number }: Object) Parameters ...

Read More

How to add linethrough to Text using FabricJS?

Rahul Gurung
Rahul Gurung
Updated on 13-Sep-2022 269 Views

In this tutorial, we are going to learn about how to set the text decoration of Text object using FabricJS. We can display text on canvas by adding an instance of fabric.Text. Not only does it allow us to move, scale and change the dimensions of the text but it also provides additional functionality like text alignment, font family, line height which can be obtained by the properties textAlign, fontFamily and lineHeight respectively. We can add linethrough by using the linethrough property. Syntax new fabric.Text(text: String , { linethrough: Boolean }: Object) Parameters text − This parameter accepts ...

Read More

How to add line height to multiline text in Text using FabricJS?

Rahul Gurung
Rahul Gurung
Updated on 13-Sep-2022 708 Views

In this tutorial, we are going to learn about how to add line height to multiline text in Text object using FabricJS. We can display text on canvas by adding an instance of fabric.Text. Not only does it allow us to move, scale and change the dimensions of the text but it also provides additional functionality like text alignment, text decoration, line height which can be obtained by the properties textAlign, underline and lineHeight respectively. We can add extra height between lines by using the lineHeight property. Syntax new fabric.Text(text: String, { lineHeight: Number }: Object) Parameters text ...

Read More

How to add animation in Text using FabricJS?

Rahul Gurung
Rahul Gurung
Updated on 13-Sep-2022 953 Views

In this tutorial, we are going to learn how to add animation in Text using FabricJS. We can display text on canvas by adding an instance of fabric.Text. Not only does it allow us to move, scale and change the dimensions of the text but it also provides additional functionality like text alignment, text decoration, line height which can be obtained by the properties textAlign, underline and lineHeight respectively. Similarly, we can also animate text by using the animate method. Syntax animate(property: String | Object, value: Number | Object) Parameters property − This property accepts a String ...

Read More
Showing 161–170 of 490 articles
« Prev 1 15 16 17 18 19 49 Next »
Advertisements