Horje
How to Check If It Is a Straight Line in JavaScript?

In this article, we are going to learn how we can check whether the given line is a Straight line or not using JavaScript. There are several methods of checking if the given line is straight or not in JavaScript. Below is an example to understand the problem clearly.

Example:

Input: points =  [[1, 2], [2, 3], [3, 4], [4, 5]]
Output: true

Input: points = [[2,3], [7, 2] , [-1, 3]]
Output: false

Below are different approaches to Check If It Is a Straight Line in JavaScript:

Using Slope Calculation

Define a function that takes an array of coordinates as parameter. Get the x and y coordinates of the first two points from the coordinates array. Compute the slope between the first two points using the formula (y1 – y0) / (x1 – x0). Iterate through the remaining coordinates starting from index 2. For each point, calculate the slope between that point and the first point, and compare it with the initial slope. If slopes are not equal, return false else return true.

Example: To demonstrate checking If It Is a straight line in JavaScript using slope calculation approach.

JavaScript
function checkLine(coordinates) {
    const [x0, y0] = coordinates[0];
    const [x1, y1] = coordinates[1];
    const slope = (y1 - y0) / (x1 - x0);

    for (let i = 2; i < coordinates.length; i++) {
        const [x, y] = coordinates[i];
        if ((y - y0) / (x - x0) !== slope) {
            return false;
        }
    }
    return true;
}
const coordinates = [[1, 2], [2, 3], [3, 4], [4, 5]];
console.log(checkLine(coordinates)); 

Output
true

Time complexity: O(n)

Space complexity: O(1)

Using Matrix Determinant Approach

Define a function that takes an array of coordinates as its parameter. Get the x and y coordinates of the first two points from the coordinates array. Calculate the coefficients A, B, and C by using formula:

A = y1 – y0
B = x0 – x1
C = x0 * (y0 – y1) + y0 * (x1 – x0)

Iterate through the remaining coordinates starting from index 2. For each point, calculate the expression Ax + By + C and check if it equals 0. If expression is not equal to 0, return false else return true.

Example: To demonstrate checking If It Is a straight line in JavaScript using matrix determinant approach.

JavaScript
function checkLine(coordinates) {
    const [x0, y0] = coordinates[0];
    const [x1, y1] = coordinates[1];
    const A = y1 - y0;
    const B = x0 - x1;
    const C = x0 * (y0 - y1) + y0 * (x1 - x0);

    for (let i = 2; i < coordinates.length; i++) {
        const [x, y] = coordinates[i];
        if (A * x + B * y + C !== 0)
        {
            return false;
        }
    }
    return true;
}
const coordinates = [[1, 2], [2, 3], [3, 6], [4, 2]];
console.log(checkLine(coordinates));

Output
false

Time complexity: O(n)

Space complexity: O(1)

Using Cross Product Method

The cross product method is another effective way to determine if a set of points lies on a straight line. This method involves calculating the cross product of vectors formed by consecutive points. If the cross product is zero for all consecutive vectors, the points lie on a straight line.

Example:

JavaScript
function isStraightLine(points) {
    for (let i = 1; i < points.length - 1; i++) {
        let x0 = points[i-1][0], y0 = points[i-1][1];
        let x1 = points[i][0], y1 = points[i][1];
        let x2 = points[i+1][0], y2 = points[i+1][1];

        let crossProduct = (x1 - x0) * (y2 - y1) - (y1 - y0) * (x2 - x1);

        if (crossProduct !== 0) {
            return false;
        }
    }
    return true;
}
let points1 = [[1, 2], [2, 3], [3, 4], [4, 5]];
console.log(isStraightLine(points1));

let points2 = [[2, 3], [7, 2], [-1, 3]];
console.log(isStraightLine(points2));

Output
true
false

Time Complexity: O(n)

Space Complexity: O(1)





Reffered: https://www.geeksforgeeks.org


JavaScript

Related
How To Change The Browser To Fullscreen with JavaScript? How To Change The Browser To Fullscreen with JavaScript?
How to Send an HTTP POST Request in JS? How to Send an HTTP POST Request in JS?
How to Use Streaming Parsing in JavaScript? How to Use Streaming Parsing in JavaScript?
Lazy Loading Components in VueJS Lazy Loading Components in VueJS
How to use the DayJS Library to work with Date &amp; Time in JavaScript? How to use the DayJS Library to work with Date &amp; Time in JavaScript?

Type:
Geek
Category:
Coding
Sub Category:
Tutorial
Uploaded by:
Admin
Views:
14