Found 6685 Articles for Javascript

How to set the angle of skew on the Y-axis of a Textbox using FabricJS?

Rahul Gurung
Updated on 02-Aug-2022 12:59:35

148 Views

In this tutorial, we are going to learn how to set the angle of skew on the y-axis of a Textbox using FabricJS. We can customize, stretch or move around the text written in a textbox. In order to create a textbox, we will have to create an instance of fabric.Textbox class and add it to the canvas. Our textbox object can be customized in various ways like changing its dimensions, adding a background color or by changing the angle of skew on the y-axis. We can do this by using the skewY property. Syntax new fabric.Textbox(text: String, { skewY ... Read More

How to set the angle of skew on the X-axis of a Textbox using FabricJS?

Rahul Gurung
Updated on 02-Aug-2022 12:57:05

100 Views

In this tutorial, we are going to learn how to set the angle of skew on the X-axis of a Textbox using FabricJS. We can customize, stretch or move around the text written in a textbox. In order to create a textbox, we will have to create an instance of fabric.Textbox class and add it to the canvas. Our textbox object can be customized in various ways like changing its dimensions, adding a background color or by changing the angle of skew on the X-axis. We can do this by using the skewX property. Syntax new fabric.Textbox(text: String, { skewX ... Read More

How to set the angle of rotation of a Textbox using FabricJS?

Rahul Gurung
Updated on 02-Aug-2022 12:55:29

216 Views

In this tutorial, we are going to set the angle of rotation of a Textbox using FabricJS. We can customize, stretch or move around the text written in a textbox. In order to create a textbox, we will have to create an instance of fabric.Textbox class and add it to the canvas. The angle property in FabricJS defines the angle of 2D rotation of an object. We also have the centeredRotation property that allows us to use the center point of a textbox as the origin of transformation. Syntax new fabric.Textbox(text: String, { angle: Number, centeredRotation: Boolean }: Object) ... Read More

How to set the alignment of text in a Textbox using FabricJS?

Rahul Gurung
Updated on 02-Aug-2022 12:25:28

1K+ Views

In this tutorial, we are going to learn how to set the alignment of text in a Textbox using FabricJS. We can customize, stretch or move around the text written in a textbox. In order to create a textbox, we will have to create an instance of fabric.Textbox class and add it to the canvas. Similarly, we can also set its text alignment by using the textAlign property. Syntax new fabric.Textbox(text: String, { textAlign : String }: Object) Parameters text − This parameter accepts a String which is the text string that we want to display inside our ... Read More

How to make the controlling corners of a Textbox transparent using FabricJS?

Rahul Gurung
Updated on 02-Aug-2022 12:22:23

143 Views

In this tutorial, we are going to learn how to make the controlling corners of Textbox transparent using FabricJS. We can customize, stretch or move around the text written in a textbox. In order to create a textbox, we will have to create an instance of fabric.Textbox class and add it to the canvas. The transparentCorners property allows us to make the controlling corners of Textbox transparent. Syntax new fabric.Textbox(text: String, { transparentCorners: Boolean }: Object) Parameters text − This parameter accepts a String which is the text string that we want to display inside our textbox. options ... Read More

How to make a Textbox invisible using FabricJS?

Rahul Gurung
Updated on 02-Aug-2022 12:19:55

251 Views

In this tutorial, we are going to learn how to make a Textbox invisible using FabricJS. Textbox is one of the various shapes provided by FabricJS. We can customize, stretch or move around the text written in a textbox. In order to create a textbox, we will have to create an instance of fabric.Textbox class and add it to the canvas. Our textbox object can be customized in various ways like changing its dimensions, adding a background color or by making it visible or invisible. We can do this by using the visible property. Syntax new fabric.Textbox(text: String, { visible: ... Read More

How to lock the vertical scaling of Textbox using FabricJS?

Rahul Gurung
Updated on 02-Aug-2022 12:17:14

141 Views

In this tutorial, we are going to learn how to lock the vertical scaling of a Textbox using FabricJS. Just as we can specify the position, colour, opacity and dimension of a textbox object in the canvas, we can also specify whether we want to stop scaling an object vertically. This can be done by using the lockScalingY property. Syntax new fabric.Textbox(text: String, { lockScalingY : Boolean }: Object) Parameters text − This parameter accepts a String which is the text string that we want to display inside our textbox. options (optional) − This parameter is an Object ... Read More

How to lock the vertical movement of Textbox using FabricJS?

Rahul Gurung
Updated on 02-Aug-2022 12:14:00

152 Views

In this tutorial, we are going to learn how to lock the vertical movement of a Textbox using FabricJS. Just as we can specify the position, colour, opacity and dimension of a textbox object in the canvas, we can also specify whether we want it to move only in the X-axis. This can be done by using the lockMovementY property. Syntax new fabric.Textbox(text: String, { lockMovementY: Boolean }: Object) Parameters text − This parameter accepts a String which is the text string that we want to display inside our textbox. options (optional) − This parameter is an Object ... Read More

How to lock the rotation of Textbox using FabricJS?

Rahul Gurung
Updated on 02-Aug-2022 12:11:41

158 Views

In this tutorial, we are going to learn how to lock the rotation of a Textbox using FabricJS. Just as we can specify the position, colour, opacity and dimension of a textbox object in the canvas, we can also specify whether we want to allow rotation or not. This can be done by using the lockRotation property. Syntax new fabric.Textbox(text: String, { lockRotation : Boolean }: Object) Parameters text − This parameter accepts a String which is the text string that we want to display inside our textbox. options (optional) − This parameter is an Object which provides ... Read More

How to lock the horizontal skewing of Textbox using FabricJS?

Rahul Gurung
Updated on 02-Aug-2022 12:09:09

142 Views

In this tutorial, we are going to learn how to lock the horizontal skewing of a Textbox using FabricJS. Just as we can specify the position, colour, opacity and dimension of a textbox object in the canvas, we can also specify whether we want to stop skewing an object horizontally. This can be done by using the lockSkewingX property. Syntax new fabric.Textbox(text: String, { lockSkewingX : Boolean }: Object) Parameters text − This parameter accepts a String which is the text string that we want to display inside our textbox. options (optional) − This parameter is an Object ... Read More

Advertisements