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
Removing n characters from a string in alphabetical order in JavaScript
We need to write a JavaScript function that removes a specified number of characters from a string in alphabetical order. This means removing all 'a' characters first, then 'b', then 'c', and so on until we've removed the desired count. Problem Statement Given a lowercase alphabet string and a number, remove characters from the string in alphabetical order (starting with 'a', then 'b', 'c', etc.) until the specified count is reached. Example Let's implement a function that removes characters alphabetically: const str = 'abascus'; const num = 4; const removeAlphabetically = (str = ...
Read MoreCreating permutations by changing case in JavaScript
We are required to write a JavaScript function that takes in a string of characters as input and generates all possible permutations by changing the case of alphabetic characters. Our function can transform every letter individually to be lowercase or uppercase to create different strings. Non-alphabetic characters remain unchanged. We should return a list of all possible strings we could create. Problem Statement Given a string containing letters and numbers, generate all possible case permutations where each letter can be either uppercase or lowercase. Input: const str = 'k1l2'; Expected Output: ["k1l2", ...
Read MoreHow to set the angle of skew on x-axis of Triangle using FabricJS?
In this tutorial, we are going to learn how to set the angle of skew on the x-axis of a Triangle using FabricJS. Triangle is one of the various shapes provided by FabricJS. In order to create a triangle, we will have to create an instance of fabric.Triangle class and add it to the canvas. Our triangle 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.Triangle({ skewX : ...
Read MoreHow to straighten an IText object using FabricJS?
In this tutorial, we are going to learn about how to straighten an IText object 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 height ...
Read MoreFabricJS – How to set the dash pattern of the controlling corners of a Line?
In this tutorial, we are going to learn about how to set the dash pattern of controlling corners of 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. We can also specify a dash pattern for the controlling corners by using the cornerDashArray ...
Read MoreHow to capture HTML Canvas as gif/jpg/png/pdf with JavaScript?
We can use the canvas.toDataURL() method to capture HTML canvas content as different image formats like PNG, JPEG, WebP, and GIF. This method converts the canvas drawing into a data URL that can be saved or displayed as an image. Syntax canvas.toDataURL(type, encoderOptions) Parameters type (optional): The image format. Defaults to "image/png" encoderOptions (optional): Quality setting for lossy formats (0-1) Capture HTML Canvas as PNG PNG format provides lossless compression and supports transparency. Set the type to image/png: Download as ...
Read MoreHow to Add Commas Between a List of Items Dynamically in JavaScript?
In web development, you often need to display lists of items with commas separating them, like "Item 1, Item 2, Item 3". This can be achieved using CSS or JavaScript to dynamically add commas between list items. HTML Structure Consider the following HTML list structure: Item 1 Item 2 Item 3 Item 4 We'll explore two approaches to add commas between these items dynamically. Using CSS (Recommended) The CSS approach uses the ::before pseudo-element to insert commas before ...
Read MoreHow to call the key of an object but return it as a method, not a string in JavaScript?
In JavaScript, you can call object methods dynamically using bracket notation instead of dot notation. This allows you to access and execute object methods using string keys, which is useful when the method name is determined at runtime. Basic Dynamic Method Access You can use bracket notation obj[key]() to call methods dynamically: const obj = { greet: function() { console.log("Hello!"); }, farewell: function() { console.log("Goodbye!"); ...
Read MoreHow to check a URL contains a hash or not using JavaScript?
To check whether a URL contains a hash (#) fragment or not in JavaScript, we can use the window.location.hash property. This property returns the hash portion of the URL, including the # symbol, or an empty string if no hash exists. What is a URL Hash? A URL hash is the part of a URL that comes after the # symbol. For example, in the URL https://example.com/page#section1, the hash is #section1. Hashes are commonly used for navigation within a single page or to reference specific sections of content. Syntax window.location.hash This property returns: ...
Read MoreForm required attribute with a custom validation message in HTML5
HTML5 includes a number of built-in form validation features that allow developers to easily add validation to their forms. One of these features is the "required" attribute, which specifies that an input field is required and must be filled out before the form can be submitted. The "required" attribute is a boolean attribute. If any input field with the "required" attribute is present in the form, then this field must be completed before submitting the form. If that particular field is left blank before submitting the form, the user will see an error message from the browser informing ...
Read More