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 a custom key to enable/disable uniform scaling on a canvas in FabricJS?
In this article, we are going to learn how to set a custom key to enable/disable uniform scaling in FabricJS. In FabricJS, an object gets transformed proportionally when dragged from its corners. This is called uniform scaling. However, we can enable/disable this behavior by using the uniScaleKey. Syntax new fabric.Canvas(element: HTMLElement|String, { uniScaleKey: String }: Object) Parameters element − This parameter is the element itself which can be derived using Document.getElementById() or the id of the element itself. The FabricJS canvas will be initialized on this element. options (optional) − This ...
Read MoreJavaScript: How to allow users to change the font-size of a webpage?
In this article, we will explore how to create a dynamic font size control feature that allows users to adjust the font size of webpage content. This accessibility feature is commonly found on government websites and helps users customize text size for better readability. We'll implement this functionality using both vanilla JavaScript and jQuery approaches to give you flexibility in your implementation. Method 1: Using jQuery This example demonstrates a simple implementation with increase and decrease buttons that modify the font size of specific content areas. Change Font ...
Read MoreHow to invoke a function with partials prepended arguments in JavaScript?
JavaScript provides several ways to invoke functions with partial arguments prepended. This technique is particularly useful when you want to create specialized versions of existing functions or implement partial application patterns. Using the bind() Method (Recommended) The bind()
Read MoreJavaScript regex - How to replace special characters?
Characters that are neither alphabetical nor numeric are known as special characters. Special characters are essentially all unreadable characters, including punctuation, accent, and symbol marks. Remove any special characters from the string to make it easier to read and understand. Before we jump into the article let's have a quick view on the regex expression in JavaScript. Regex Expression in JavaScript Regular expressions are patterns that can be used to match character combinations in strings. Regular expressions are objects in JavaScript. These patterns can be used with the exec() and test() methods of RegExp as well as ...
Read MoreInsert a new CSS rule while working on JavaScript?
Adding a new CSS rule can help to create the desired look and feel for your web page or application. This article will explain how to insert a new CSS rule while working on JavaScript. It will provide step-by-step instructions on how to write and apply the necessary code in order to achieve the desired result. Additionally, we will also discuss some of the potential problems that may arise when inserting a new CSS rule into an existing project. The style sheet language known as CSS (cascading style sheets), is used to shape the HTML elements that will ...
Read MoreFunction to add up all the natural numbers from 1 to num in JavaScript
We are required to write a JavaScript function that takes in a number, say num. Then our function should return the sum of all the natural numbers between 1 and num, including 1 and num. For example, if num is − const num = 5; Then the output should be − const output = 15; because, 1+2+3+4+5 = 15 The Mathematical Formula We will use the efficient mathematical formula to solve this problem − Sum of all natural numbers up to n = ...
Read MoreMapping an array to a new array with default values in JavaScript
In JavaScript, mapping an array to a new array with default values is a common task when you need to transform data while ensuring missing or invalid values are replaced with fallback values. What is Array Mapping? Array mapping creates a new array by transforming each element of an existing array through a callback function. The original array remains unchanged, and the new array has the same length. const numbers = [1, 2, 3]; const doubled = numbers.map(x => x * 2); console.log(numbers); // Original unchanged console.log(doubled); // New transformed array ...
Read MorePerforming shifts within a string in JavaScript
In JavaScript, string shifting involves moving characters from one end of a string to the other. This is commonly used in algorithms and data manipulation tasks where you need to rotate string characters based on specific directions and amounts. String shifts can be performed in two directions: Left shift (0): Remove characters from the beginning and append them to the end Right shift (1): Remove characters from the end and prepend them to the beginning Understanding Shift Operations Let's see how individual shifts work: // Left shift by 1: "abc" -> "bca" ...
Read Moreasync.queue() Method in Node.js
The async module provides different functionalities to work with asynchronous JavaScript in a Node.js application. The async.queue() method creates a queue object for concurrent processing of tasks, allowing multiple items to be processed simultaneously based on a specified concurrency limit. Installation First, initialize your Node.js project and install the async module: npm init npm install --save async Then import the async module in your program: const async = require('async'); Syntax async.queue(worker, concurrency) Parameters worker – A function that processes each ...
Read MoreHow to customize the viewport of the canvas using FabricJS?
In this article, we are going to learn how to customize the viewport of the canvas using FabricJS. The viewport is the visible area of the canvas that users can see. We can customize the viewport using the viewportTransform property, which allows us to control transformations like scaling, translation, and skewing of the entire canvas view. What is viewportTransform? The viewportTransform property is a transformation matrix represented as an array of 6 values: [scaleX, skewY, skewX, scaleY, translateX, translateY]. This matrix transforms the entire canvas coordinate system, affecting how all objects are displayed. Syntax new ...
Read More