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
Volume difference of cuboids in JavaScript
We are required to write a JavaScript function that takes in two arrays, specifying the lengths, widths, and heights of two cuboids. Our function should calculate the volume of both cuboids and return their absolute difference. Formula The volume of a cuboid is calculated as: Volume = length × width × height Example Following is the code: const h1 = 10; const w1 = 12; const l1 = 15; const h2 = 12; const w2 = 15; const l2 = 9; const findVolumeDifference = (l1, w1, h1, l2, w2, ...
Read MoreHow to flip a Circle horizontally using FabricJS?
In this tutorial, we are going to learn how we can flip a Circle object horizontally using FabricJS. Circle is one of the various shapes provided by FabricJS. In order to create a circle, we have to create an instance of fabric.Circle class and add it to the canvas. We can flip a circle object horizontally using the flipX property. Syntax new fabric.Circle({ flipX: Boolean }: Object) Parameters options (optional) − This parameter is an Object which provides additional customizations to our circle. ...
Read MoreHow to set the angle of skew on the X-axis of a Textbox using FabricJS?
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: ...
Read MoreHow to change the duration of cursor fadein in IText using FabricJS?
In this tutorial, we are going to learn about how to change the duration of cursor fadein 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 ...
Read MoreHow to use Particle.js in JavaScript project?
Particle.js is a JavaScript library that creates stunning visual effects by adding animated particles to HTML elements. You can customize particle shapes, colors, motion, and interactions to enhance your web projects with dynamic backgrounds and visual effects. This library is perfect for creating engaging landing pages, interactive backgrounds, and modern web interfaces with floating particles that respond to user interactions. Syntax The basic syntax to initialize particles using the tsParticles library: tsParticles.load("elementId", { particles: { // Configuration options for particles ...
Read MoreChunking arrays in JavaScript
Chunking arrays in JavaScript means splitting a single array into smaller subarrays of a specified size. This is useful for pagination, data processing, and organizing information into manageable groups. For example, if we have an array of 7 elements and want chunks of size 2, the last chunk will contain only 1 element since 7 is not evenly divisible by 2. Input and Expected Output Given this input array: const arr = [1, 2, 3, 4, 5, 6, 7]; The expected output should be: [[1, 2], [3, 4], [5, 6], [7]] ...
Read MoreFlat array of objects to tree in JavaScript
Converting a flat array of objects into a tree structure is a common requirement in web development. This involves organizing objects with parent-child relationships into a hierarchical format. The Data Structure We start with a flat array where each object has an id, name, and parentId. Objects with parentId: null are root nodes, while others are children. .parent, .child { cursor: pointer; ...
Read MoreRecursive loop that prints an inverted count in JavaScript
In JavaScript, we can create a recursive function to print numbers in descending order from a given number down to zero. This demonstrates how recursion can solve problems by breaking them into smaller subproblems. What is Recursion? Recursion is a programming technique where a function calls itself to solve smaller instances of the same problem. Each recursive call works on a reduced version of the original problem until reaching a base case that stops the recursion. Classic examples include calculating factorials, Fibonacci sequences, and tree traversals. Problem Understanding Our goal is to create a function that ...
Read MoreJavaScript - Find if string is a palindrome (Check for punctuation)
In JavaScript, checking if a string is a palindrome while handling punctuation requires cleaning the string first. A palindrome reads the same forwards and backwards, ignoring spaces, punctuation, and case. What is a Palindrome? A palindrome is not limited to single words like "radar" or "level"; it can include phrases or sequences like "Madam, in Eden, I'm Adam." We need to ignore punctuation, spaces, and case differences to ensure accurate palindrome checks. Using String and Array Methods The first approach uses JavaScript's built-in string and array methods to normalize and reverse the string: ...
Read MoreFinding matching pair from an array in JavaScript
We are required to write a JavaScript function that takes in an array of integers that might contain some repeating values. Our function should find out the number of pairs of identical integers we can extract out of the array. For example, if the input array is: const arr = [1, 5, 2, 1, 6, 2, 2, 9]; Then the output should be: const output = 2; because the desired pairs are (1, 1) and (2, 2). Note that we have three 2's, but we can only form one pair from ...
Read More