Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Articles on Trending Technologies
Technical articles with clear explanations and examples
How to set the opacity of an Ellipse using FabricJS?
In this tutorial, we are going to learn how to set the opacity of Ellipse using FabricJS. Ellipse is one of the various shapes provided by FabricJS. In order to create an ellipse, we will have to create an instance of fabric.Ellipse class and add it to the canvas. We can customize an ellipse object by adding a fill color to it, eliminate its borders or even make changes in its dimensions. Similarly, we can also change its opacity by using the opacity property. Syntax new fabric.Ellipse({ opacity: Number }: Object) Parameters ...
Read MoreHow to set the opacity of Textbox using FabricJS?
In this tutorial, we are going to learn how to set the opacity of Textbox using FabricJS. Textbox is one of the various shapes provided by FabricJS. In order to create a textbox, we will have to create an instance of fabric.Textbox class and add it to the canvas. We can customize a textbox object by adding a fill colour to it, eliminate its borders or even make changes in its dimensions. Similarly, we can also change its opacity by using the opacity property. Syntax new fabric.Textbox(text: String, { opacity: Number }: Object) Parameters ...
Read MoreHow to create text path in IText using FabricJS?
In this tutorial, we are going to learn about how to create text path in IText using FabricJS. The IText class was introduced in FabricJS version 1.4, extends fabric.Text and is used to create IText instances. An IText instance gives us the freedom to select, cut, paste or add new text without additional configurations. There are also various supported key combinations and mouse/touch combinations which make text interactive which are not provided in Text. Textbox, however, which is based on IText allows us to resize the text rectangle and wraps lines automatically. This is not true for IText as ...
Read MoreFabricJS – How to scale an image equally on horizontal and vertical directions?
In this tutorial, we are going to learn how to scale an image equally on horizontal and vertical directions using FabricJS. We can create an Image object by creating an instance of fabric.Image. Since it is one of the basic elements of FabricJS, we can also easily customize it by applying properties like angle, opacity etc. In order to scale an image equally on horizontal and vertical directions, we use the scale method. Syntax scale(value: Number): fabric.Object Parameters value − This parameter accepts a Number which sets the scale factor ...
Read MoreExplain Promise.all with async-await in JavaScript?
Simple operations like adding two numbers or string manipulation codes execute sequentially in JavaScript and return the results instantly. But while coding for real-world applications, we frequently make time-taking calls to databases, APIs, and other applications. These longer calls don't return the results instantly; they will rather return a promise. A promise is an object to represent the future results of an asynchronous operation. It is used to handle asynchronous processes' eventual success or failure. For instance, if you request some object from an API in JavaScript, you will be given a promise that the task will eventually be ...
Read MoreExplain the different ready states of a request in AJAX
AJAX stands for Asynchronous JavaScript and XML. It is a set of web development techniques to create interactive web applications. AJAX allows a web page to communicate with a server without reloading the page. Ready states are an important part of working with AJAX requests. The ready state of a request indicates the request's status to the server and allows the client to track the progress of the request through the readyState property of the XMLHttpRequest object. In the below sections, we detail the different ready states of AJAX requests. UNSENT STATE (0) This is the ...
Read MoreHow to convert special characters to HTML in Javascript?
Special characters like , and & have special meaning in HTML and can break your webpage if not properly escaped. JavaScript provides several methods to convert these characters into their HTML entity equivalents. Why Convert Special Characters to HTML? When displaying user input or dynamic content on a webpage, special characters can cause problems. For example, if you want to display "" as text, the browser might interpret it as an actual HTML tag. Converting these characters to HTML entities like ensures they display as intended text. Common characters that need escaping: ...
Read MoreRemoving duplicate values in a twodimensional array in JavaScript
When working with two-dimensional arrays in JavaScript, you may need to remove duplicate values that appear across different sub-arrays. This article shows how to create a function that removes all duplicate values from a 2D array, keeping only the first occurrence of each value. Problem Statement We need to write a JavaScript function that takes a two-dimensional array and returns a new array where duplicate values across all sub-arrays are removed, preserving only the first occurrence of each value. Example Here's how to implement this functionality: const arr = [ ...
Read MoreRemoving listener from inside outer function in JavaScript?
When working with event listeners in JavaScript, you might need to remove a listener from within an outer function. This is accomplished using removeEventListener() by passing the element reference and function reference to the outer function. How It Works The key is to pass both the element (this) and the function reference to the outer function, then use removeEventListener() to detach the listener. Example Remove Event Listener Example Press Me ...
Read MoreJavaScript: compare array element properties, and if identical, combine
When working with arrays of objects, you often need to combine objects that have identical properties. In this example, we'll consolidate storage devices with the same size by adding up their counts. Suppose we have an array of objects containing information about data storage devices: const drives = [ {size:"900GB", count:3}, {size:"900GB", count:100}, {size:"1200GB", count:5}, {size:"900GB", count:1} ]; console.log("Original array:", drives); Original array: [ { size: '900GB', count: 3 }, { size: '900GB', count: ...
Read More