Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Economics & Finance
To display images on click using JavaScript and HTML, you can create hidden images, add click events, and reveal images dynamically for an interactive user experience. This technique enhances user engagement and improves page load times by showing content only when needed. Users often want to create interactive web pages where images are initially hidden and can be revealed with a click. The challenge is implementing this functionality using JavaScript and HTML in a simple and efficient manner. Approaches to Show Images with a Click Using the Style Display Property Using ... Read More
The stroke and strokeWidth properties are used to set the stroke color and width of a canvas circle in Fabric.js. These properties allow you to customize the border appearance of circle objects. The Fabric.js Circle class provides a rich set of features for creating interactive circles. Unlike basic HTML5 canvas circles, Fabric.js circles are movable, resizable, and highly customizable with properties for stroke, fill, dimensions, and positioning. Syntax fabric.Circle({ radius: number, stroke: string, strokeWidth: number }); Parameters radius − Specifies the radius of the ... Read More
When working with arrays of objects, you might need to sort them so that items with specific properties appear first. This is a common requirement in applications where you need to prioritize certain elements while maintaining the original order of others. Suppose we have an array of objects like this: const arr = [ {flag: true, other: 1}, {flag: true, other: 2}, {flag: false, other: 3}, {flag: true, other: 4}, {flag: true, other: 5}, ... Read More
In JavaScript, you can change a button's color dynamically when an input field is filled by using event listeners and checking the input's value. This creates an interactive user interface that responds to user input in real-time. Basic HTML Structure First, let's set up the HTML elements we'll be working with: Press Me Using onkeyup Event The onkeyup event triggers every time a key is released in the input field, allowing us to check the input's value and update the button color accordingly. ... Read More
When working with sorted arrays containing consecutive numbers, we often need to represent sequences in a compressed format. Instead of listing all consecutive numbers, we can show ranges using a dash (-) separator. For example, instead of [1, 2, 3, 5, 7, 8, 9, 11], we want to display "1-3, 5, 7-9, 11". Problem Statement Given a sorted array of numbers, we need to: Group consecutive numbers into ranges (e.g., 1, 2, 3 becomes "1-3") Keep standalone numbers as-is Join all parts with commas const arr = [1, 2, 3, 5, 7, 8, ... Read More
We are required to write a JavaScript function that takes in an array of numbers and checks if the mean and mode are equal. The function should calculate both statistical measures and return true if they match, false otherwise. For example − If the input array is − const arr = [5, 3, 3, 3, 1]; Then the output for this array should be true because both the mean and mode of this array are 3. Understanding Mean and Mode The mean is the average of all numbers in the dataset. The ... Read More
Two words can mesh together if the ending substring of the first word is the starting substring of the second word. For instance, "robinhood" and "hoodie" can mesh together because "hood" appears at the end of "robinhood" and at the start of "hoodie". We need to write a JavaScript function that takes an array of strings and checks if all consecutive words mesh together. If they do, the function returns the meshed letters as a string, otherwise it returns an empty string. How It Works The solution uses a regular expression to find overlapping substrings between consecutive ... Read More
Problem We are required to write a JavaScript function that takes in a range array of two numbers. Our function should find the sum of all the cubes of the numbers that falls in the specified range. Understanding the Problem Given a range [a, b], we need to calculate a³ + (a+1)³ + (a+2)³ + ... + b³. For example, with range [4, 11], we calculate 4³ + 5³ + 6³ + 7³ + 8³ + 9³ + 10³ + 11³. Solution Using For Loop Here's the implementation that iterates through the range and sums the cubes: const range = [4, 11]; const sumCubes = ([l, h]) => { const findCube = num => num * num * num; let sum = 0; for(let i = l; i
The writable.writableObjectMode property is used to check whether a writable stream is operating in object mode. It returns true if object mode is enabled, false if disabled, or undefined if not explicitly set. Syntax writable.writableObjectMode Return Value Returns a boolean value or undefined: true - Object mode is enabled false - Object mode is explicitly disabled undefined - Object mode not set (default) Example 1: Stream with Object Mode Enabled // Program to demonstrate writable.writableObjectMode property // Importing the stream module const stream = require('stream'); // Creating a ... Read More
In this tutorial, we are going to learn how to lock the horizontal movement of a Rectangle using FabricJS. Just as we can specify the position, colour, opacity and dimension of a rectangle object in the canvas, we can also specify whether we want it to move only in the Y-axis. This can be done by using the lockMovementX property. Syntax new fabric.Rect({ lockMovementX: Boolean }: Object) Parameters Options (optional) − This parameter is an Object which provides additional customizations ... Read More