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 import a SVG file in JavaScript?
Scalable Vector Graphic (SVG) is a powerful 2D image format that uses mathematical formulas and XML markup to create scalable graphics. Unlike raster images (JPEG, PNG) that rely on pixels, SVG files maintain crisp quality at any size, making them ideal for web development. SVG files offer significant advantages in web design including infinite scalability, smaller file sizes, better accessibility features, and the ability to be styled with CSS. This article explores different methods to import and use SVG files in JavaScript applications. Method 1: Using HTML Element The simplest method to display SVG files is ...
Read MoreFabricJS – Finding the current cursor position on the clicked Polygon object?
We can create a Polygon object by creating an instance of fabric.Polygon. A polygon object can be characterized by any closed shape consisting of a set of connected straight line segments. 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 find the current cursor position on the clicked Polygon object, we use the getLocalPointer method. Syntax getLocalPointer(e, pointer): Object Parameters e − This parameter accepts an Event which denotes the event to ...
Read MoreIntroduction and Installation of Nightmare.js
Nightmare.js is a high-level browser automation library developed by Segment. It's designed for automated testing and web scraping, operating as a headless browser using Electron. This library allows you to perform user interactions like clicking, typing, and navigation programmatically. What is Nightmare.js? Nightmare.js provides a simple, synchronous-style API for browser automation. Instead of dealing with complex callback structures, it exposes intuitive methods that mimic user actions such as goto, type, and click. Originally created for automating websites without APIs, it's now commonly used for: UI testing and smoke tests Web scraping and data extraction Screenshot generation ...
Read MoreFinding trailing zeros of a factorial JavaScript
Given an integer n, we have to write a function that returns the number of trailing zeroes in n! (factorial). For example: trailingZeroes(4) = 0 trailingZeroes(5) = 1 because 5! = 120 trailingZeroes(6) = 1 How It Works Trailing zeros are created by multiplying factors of 10, which come from pairs of 2 and 5. Since there are always more factors of 2 than 5 in any factorial, we only need to count factors of 5. We count multiples of 5, then 25 (5²), then 125 (5³), and so on. Example const num = 17; const findTrailingZeroes = num => { let cur = 5, total = 0; while (cur
Read MoreHow to reverse a string using only one variable in JavaScript
In this problem statement, our target is to print the reverse string using only one variable and implement the solution with the help of JavaScript. We can solve this problem with the help of loops in JavaScript. Understanding the Problem The given problem is stating that we have a string which we need to reverse using only one variable. In simple terms, if we have the string "Hello World", the reverse of this string will be "dlroW olleH". Logic for the Given Problem In order to reverse the given string with only one variable, we will ...
Read MoreWriting a custom URL shortener function in JavaScript
URL shorteners convert long URLs into shorter, more manageable links. This tutorial shows how to build a simple URL shortener with JavaScript functions for encoding and decoding URLs. Problem Statement We need to create two JavaScript functions: First function takes a long URL and returns a corresponding short URL Second function takes the short URL and returns the original long URL How It Works Our approach uses an object to store mappings between short and long URLs. The short URL is generated by extracting letters from the original URL and taking the last ...
Read MoreImplementing circular queue ring buffer in JavaScript
A circular queue is a linear data structure that operates on the FIFO (First In First Out) principle, where the last position connects back to the first position forming a circle. It's also called a "Ring Buffer". The main advantage of a circular queue is efficient space utilization. Unlike regular queues, when elements are dequeued from the front, those positions become available for new elements, preventing wasted space. 0 1 ...
Read MoreHow to create a canvas with background image using FabricJS?
In this article, we are going to create a canvas with a background image using FabricJS. There are two ways available in FabricJS, using which we can change the background image of the canvas. First method is by using the Canvas class itself and passing backgroundImage in the second parameter of the class. Second method is to use the setBackgroundImage method. Let's see into each of them with an example. ...
Read MoreHow to set the fill color of a Circle using FabricJS?
In this tutorial, we are going to learn how we can change the appearance of a Circle object by changing its fill colour using FabricJS. Circle is one of the various shapes provided by FabricJS. In order to create a circle, we will have to create an instance of fabric.Circle class and add it to the canvas. We can change the fill colour by using the fill property which allows us to specify the colour of the object's fill. Syntax new fabric.Circle({ fill: String }: Object) Parameters ...
Read MoreHow to set the style of individual characters in IText using FabricJS?
In this tutorial, we are going to learn how to set the style of individual characters 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 ...
Read More