How to set the horizontal scale factor of a Rectangle using FabricJS?

Rahul Gurung
Updated on 15-Mar-2026 23:19:00

376 Views

In this tutorial, we are going to learn how to set the horizontal scale factor of a Rectangle using FabricJS. Rectangle is one of the various shapes provided by FabricJS. In order to create a rectangle, we will have to create an instance of fabric.Rect class and add it to the canvas. Just as we can specify the position, colour, opacity and dimension of a rectangle object in the canvas, we can also set the horizontal scale of a rectangle object. This can be done by using the scaleX property. Syntax new fabric.Rect({ scaleX : Number ... Read More

How to find the real center coordinates of a Line object using FabricJS?

Rahul Gurung
Updated on 15-Mar-2026 23:19:00

521 Views

In this tutorial, we are going to learn about how to find the center coordinates of a Line using FabricJS. A Line element is one of the basic elements provided in FabricJS. It is used for creating straight lines. Because line elements are geometrically one-dimensional and do not contain an interior, they are never filled. We can create a line object by creating an instance of fabric.Line, specifying the x and y coordinates of the line and adding it to the canvas. In order to find the real center coordinates of a Line object, we use the getCenterPoint method. ... Read More

How to add an element to a JSON object using JavaScript?

AmitDiwan
Updated on 15-Mar-2026 23:19:00

30K+ Views

In this article, you will understand how to add an element to a JSON object using JavaScript. JSON objects are key-value pairs separated by colons and surrounded by curly braces {}. JavaScript provides two main ways to add new properties: bracket notation and dot notation. Using Bracket Notation Bracket notation is useful when property names contain special characters or are stored in variables. var jsonObject = { members: { host: "hostName", viewers: ... Read More

Array.prototype.fill() with object passes reference and not new instance in JavaScript?

AmitDiwan
Updated on 15-Mar-2026 23:19:00

255 Views

When using Array.prototype.fill() with objects, JavaScript passes the same reference to all array positions instead of creating new instances. This means modifying one object affects all elements. The Problem with fill() and Objects Using fill() with an object creates multiple references to the same object: // This creates the same object reference in all positions let arr = new Array(3).fill({name: "John", age: 25}); console.log("Original array:"); console.log(arr); // Modifying one element affects all arr[0].name = "Alice"; console.log("After modifying arr[0].name:"); console.log(arr); Original array: [ { name: 'John', age: 25 }, { name: ... Read More

How to display value of textbox in JavaScript?

Yaswanth Varma
Updated on 15-Mar-2026 23:19:00

19K+ Views

To display value of textbox in JavaScript, you can access the user input for validation, form processing, or real-time feedback. This is essential for checking email format, password strength, and other input validation requirements. In this article, we will explore two different approaches to get and display textbox values in JavaScript using practical examples. Approaches to Display Value of Textbox Here are the main approaches to display textbox values in JavaScript that we'll cover: Using value Property Using FormData Object Using value Property The ... Read More

Sum JavaScript arrays repeated value

AmitDiwan
Updated on 15-Mar-2026 23:19:00

373 Views

Suppose, we have an array of objects like this − const arr = [ {'TR-01':1}, {'TR-02':3}, {'TR-01':3}, {'TR-02':5}]; We are required to write a JavaScript function that takes in one such array and sums the value of all identical keys together. Therefore, the summed array should look like − const output = [ {'TR-01':4}, {'TR-02':8}]; Method 1: Using In-Place Modification This approach modifies the original array by tracking duplicate keys and summing their values: const arr = [ {'TR-01':1}, {'TR-02':3}, {'TR-01':3}, {'TR-02':5}]; const sumDuplicate = arr => ... Read More

Finding the smallest multiple in JavaScript

Nikitasha Shrivastava
Updated on 15-Mar-2026 23:19:00

573 Views

In JavaScript, finding the smallest multiple of numbers from 1 to n is equivalent to finding their Least Common Multiple (LCM). This tutorial demonstrates how to solve this problem using loops and mathematical concepts. Understanding the Problem The problem is to find the smallest positive number that is divisible by all numbers from 1 to a given number n. For example, the smallest multiple of numbers 1 to 4 is 12, because 12 is divisible by 1, 2, 3, and 4. Algorithm Logic ... Read More

Picking all elements whose value is equal to index in JavaScript

AmitDiwan
Updated on 15-Mar-2026 23:19:00

310 Views

We are required to write a JavaScript function that takes in an array of numbers as the first and the only argument. The function should then construct and return a new array based on the original array. The new array should contain all those elements from the original array whose value was equal to the index they were placed on. Note that we have to check the value and index using 1-based index and not the traditional 0-based index. Understanding the Problem For example, if the input array is: const arr = [45, ... Read More

Mathematics summation function in JavaScript

AmitDiwan
Updated on 15-Mar-2026 23:19:00

2K+ Views

Problem We are required to write a JavaScript function that takes in a number n. Our function should return the sum of all the natural numbers from 1 to n including both 1 and n. Example Following is the code − const num = 34; const summation = (num = 1) => { let res = 0; for(let i = 1; i { return (num * (num + 1)) / 2; }; console.log(summationFormula(34)); // Same result console.log(summationFormula(100)); // Testing with larger number ... Read More

Finding the only unique string in an array using JavaScript

Aayush Mohan Sinha
Updated on 15-Mar-2026 23:19:00

1K+ Views

In JavaScript, finding a unique string that appears only once in an array is a common programming challenge. This article demonstrates two effective approaches to solve this problem. Problem Statement Write a JavaScript function that takes an array of strings as input and returns the only unique string present in the array. A unique string is defined as a string that occurs only once in the given array. If there are no unique strings, the function should return null. Sample Input: const strings = ["apple", "banana", "orange", "banana", "kiwi", "kiwi", "apple"]; Sample Output: ... Read More

Advertisements