Skip to content

Commit

Permalink
Merge pull request #1836 from saketh-05/master
Browse files Browse the repository at this point in the history
Added EigenValue and EigenVector Calculator
  • Loading branch information
swapnilsparsh authored Jun 19, 2024
2 parents d5fb788 + def3ad6 commit 1324954
Show file tree
Hide file tree
Showing 7 changed files with 245 additions and 31 deletions.
27 changes: 27 additions & 0 deletions 128 - Eigen Value and Vector Calculator/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Eigenvalue and Eigenvector Calculator</title>
<link rel="stylesheet" href="style.css" />
</head>
<body>
<div class="container">
<h2>Largest Eigen Value and Eigen Vector Calculator</h2>
<form id="matrix-form">
<label for="dimension">Enter matrix dimension (N x N):</label>
<input type="number" id="dimension" min="2" max="10" value="2" />
<button type="button" onclick="generateMatrixInput()">
Generate Matrix Input
</button>
</form>
<div id="matrix-input"></div>
<button id="calculate" style="display: none" onclick="calculateEigen()">
Calculate
</button>
<div id="results"></div>
</div>
<script src="script.js"></script>
</body>
</html>
79 changes: 79 additions & 0 deletions 128 - Eigen Value and Vector Calculator/script.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,79 @@
function generateMatrixInput() {
const dimension = document.getElementById("dimension").value;
const matrixInputDiv = document.getElementById("matrix-input");
matrixInputDiv.innerHTML = ""; // Clear previous inputs

for (let i = 0; i < dimension; i++) {
const rowDiv = document.createElement("div");
for (let j = 0; j < dimension; j++) {
const input = document.createElement("input");
input.type = "number";
input.id = `matrix-${i}-${j}`;
input.value = Math.floor(Math.random() * 10); // Default random values for fun
rowDiv.appendChild(input);
}
matrixInputDiv.appendChild(rowDiv);
}

document.getElementById("calculate").style.display = "inline-block";
}

function calculateEigen() {
const dimension = document.getElementById("dimension").value;
const matrix = [];

// Read matrix values from inputs
for (let i = 0; i < dimension; i++) {
const row = [];
for (let j = 0; j < dimension; j++) {
const value = parseFloat(
document.getElementById(`matrix-${i}-${j}`).value
);
row.push(value);
}
matrix.push(row);
}

// Perform power iteration to find largest eigenvalue and eigenvector
let eigenvalue = 0;
let eigenvector = new Array(dimension).fill(1);
const tolerance = 1e-6;
const maxIterations = 1000;

for (let iter = 0; iter < maxIterations; iter++) {
let newEigenvector = multiplyMatrixVector(matrix, eigenvector);
let norm = Math.max(...newEigenvector.map(Math.abs));
newEigenvector = newEigenvector.map((val) => val / norm);

if (Math.abs(norm - eigenvalue) < tolerance) {
eigenvalue = norm;
eigenvector = newEigenvector;
break;
}

eigenvalue = norm;
eigenvector = newEigenvector;
}

displayResults(eigenvalue, eigenvector);
}

function multiplyMatrixVector(matrix, vector) {
const result = [];
for (let i = 0; i < matrix.length; i++) {
let sum = 0;
for (let j = 0; j < vector.length; j++) {
sum += matrix[i][j] * vector[j];
}
result.push(sum);
}
return result;
}

function displayResults(eigenvalue, eigenvector) {
const resultsDiv = document.getElementById("results");
resultsDiv.innerHTML = `<p><strong>Largest Eigenvalue:</strong> ${eigenvalue.toFixed(6)}</p>`;
resultsDiv.innerHTML += `<p class="value"><strong>Corresponding Eigenvector:</strong></br>[${eigenvector
.map((val) => val.toFixed(6))
.join(", ")}]</p>`;
}
92 changes: 92 additions & 0 deletions 128 - Eigen Value and Vector Calculator/style.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,92 @@
body {
font-family: "Arial", sans-serif;
background: rgb(29,29,124);
background: linear-gradient(90deg, rgba(29,29,124,0.9641106442577031) 30%, rgba(0,23,28,1) 90%);
display: flex;
justify-content: center;
position: relative;
color: #473434;
}

.container {
background-color: #ffffff;
padding: 30px;
border-radius: 15px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
width: 500px;
text-align: center;
position: absolute;
top: 85px;
}

h1 {
margin-bottom: 20px;
font-size: 24px;
color: #0056b3;
}

form {
margin-bottom: 20px;
}

label {
font-size: 16px;
color: #333;
}

input[type="number"] {
width: 60px;
padding: 5px;
margin: 10px 5px;
border: 1px solid #ccc;
border-radius: 5px;
font-size: 16px;
}

button {
padding: 10px 15px;
margin-top: 20px;
font-size: 16px;
color: #fff;
background-color: #007bff;
border: none;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s ease;
}
#matrix-form {
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
}
button:hover {
background-color: #0056b3;
}

#matrix-input {
margin-top: 20px;
}

#results {
margin-top: 30px;
background-color: #f9f9f9;
padding: 15px;
border-radius: 10px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

#results p {
font-size: 16px;
margin: 10px 0;
}
.value{
display: flex;
justify-content: space-between;
flex-direction: column;
}
@media screen and (max-width: 530px) {
.container {
width: 70%;
}
}
Binary file added 30DaysOfJavaScript/assets/128.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 2 additions & 1 deletion 30DaysOfJavaScript/script.js
Original file line number Diff line number Diff line change
Expand Up @@ -190,7 +190,8 @@ function search_project() {
{ name: "Minesweeper", url: "./113 - Minesweeper/index.html" },
{ name: "Guess the Country", url: "./115 - Guess The Country/index.html"},
{ name: "2048 Game", url: "./124 - 2048 Game/index.html"},
{ name: "Flappy Bird Game", url: "./125 - Flappy Bird/index.html"}
{ name: "Flappy Bird Game", url: "./125 - Flappy Bird/index.html"},
{ name: "Largest EigenValue and EigenVector Calculator", url: "./128 - Eigen Value and Vector Calculator/index.html"}
];

// Filter suggestions based on input
Expand Down
62 changes: 32 additions & 30 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -141,36 +141,38 @@ Repo containing all the projects made in 30 Days while completing the <b>30 Days
<tr><th></th><th></th></tr>
<tr><td>

| Day | Name |
| --- | :--------------------------------------------------------------------------------------------------------------: |
| 91 | [Multiply Math Game](https://30daysofjs.netlify.app/167%20-%20Multiply%20Math%20Game/) |
| 92 | [Casio](https://30daysofjs.netlify.app/92%20-%20Casio/) |
| 93 | [Typer](https://30daysofjs.netlify.app/93%20-%20Typer/) |
| 94 | [Word Guess](https://30daysofjs.netlify.app/168%20-%20Word%20Guess/) |
| 95 | [Whack a Mole Game](https://30daysofjs.netlify.app/95%20-%20Whack%20a%20Mole%20Game/) |
| 96 | [Pomodoro Clock](https://30daysofjs.netlify.app/96%20-%20Pomodoro%20Clock/) |
| 97 | [Captcha Generator](https://30daysofjs.netlify.app/97%20-%20Captcha%20Generator/) |
| 98 | [Math Game](https://30daysofjs.netlify.app/172%20-%20Math%20Game/) |
| 99 | [BlackJack Game](https://30daysofjs.netlify.app/99%20-%20BlackJack%20Game/) |
| 100 | [Coin Game](https://30daysofjs.netlify.app/166%20-%20Coin%20Game/) |
| 101 | [Bomb Throw Game](https://30daysofjs.netlify.app/164%20-%20Bomb%20Throw%20Game/) |
| 102 | [Minesweeper Game](https://30daysofjs.netlify.app/102%20-%20Minesweeper%20Game/) |
| 103 | [Retro Mario Game](https://30daysofjs.netlify.app/162%20-%20Retro%20Mario%20Game/) |
| 104 | [Catch Me If You Can](https://30daysofjs.netlify.app/104%20-%20Catch%20Me%20If%20You%20Can/) |
| 105 | [Word For Alphabet Speak Aloud](https://30daysofjs.netlify.app/154%20-%20Word%20For%20Alphabet%20Speak%20Aloud/) |
| 106 | [Snowy Particle Js](https://30daysofjs.netlify.app/150%20-%20Snowy%20Particle%20Js/) |
| 107 | [Stack Game](https://30daysofjs.netlify.app/134%20-%20Stack%20Game/) |
| 108 | [Maths addition](https://30daysofjs.netlify.app/108%20-%20Maths%20addition/) |
| 109 | [Number Facts](https://30daysofjs.netlify.app/145%20-%20Number%20Facts/) |
| 110 | [Pixel to em Converter](https://30daysofjs.netlify.app/110%20-%20Pixel%20to%20em%20Converter/) |
| 111 | [Luminosity Particle Js](https://30daysofjs.netlify.app/141%20-%20Luminosity%20Particle%20Js/) |
| 112 | [Maze Game](https://30daysofjs.netlify.app/112%20-%20Maze%20Game/) |
| 113 | [Minesweeper](https://30daysofjs.netlify.app/113%20-%20minesweeper/) |
| 114 | [Movie Guessing Game](https://30daysofjs.netlify.app/114%20-%20Movie%20-%20Guessing%20Game/) |
| 116 | [Shell Game](https://30daysofjs.netlify.app/116%20-%20Shell%20-%20Game/) |
| 124 | [2048 Game](https://30daysofjs.netlify.app/124%20-%202048%20Game/) |
| 125 | [Flappy Bird Game](https://30daysofjs.netlify.app/125%20-%20Flappy%20-%20Bird%20Game/) |
| 126 | [Arcade Game](https://30daysofjs.netlify.app/124%20-%Arcade48%20Game/)
| Day | Name |
| --- | :----------------------------------------------------------------------------------------------------------------------------------: |
| 91 | [Multiply Math Game](https://30daysofjs.netlify.app/167%20-%20Multiply%20Math%20Game/) |
| 92 | [Casio](https://30daysofjs.netlify.app/92%20-%20Casio/) |
| 93 | [Typer](https://30daysofjs.netlify.app/93%20-%20Typer/) |
| 94 | [Word Guess](https://30daysofjs.netlify.app/168%20-%20Word%20Guess/) |
| 95 | [Whack a Mole Game](https://30daysofjs.netlify.app/95%20-%20Whack%20a%20Mole%20Game/) |
| 96 | [Pomodoro Clock](https://30daysofjs.netlify.app/96%20-%20Pomodoro%20Clock/) |
| 97 | [Captcha Generator](https://30daysofjs.netlify.app/97%20-%20Captcha%20Generator/) |
| 98 | [Math Game](https://30daysofjs.netlify.app/172%20-%20Math%20Game/) |
| 99 | [BlackJack Game](https://30daysofjs.netlify.app/99%20-%20BlackJack%20Game/) |
| 100 | [Coin Game](https://30daysofjs.netlify.app/166%20-%20Coin%20Game/) |
| 101 | [Bomb Throw Game](https://30daysofjs.netlify.app/164%20-%20Bomb%20Throw%20Game/) |
| 102 | [Minesweeper Game](https://30daysofjs.netlify.app/102%20-%20Minesweeper%20Game/) |
| 103 | [Retro Mario Game](https://30daysofjs.netlify.app/162%20-%20Retro%20Mario%20Game/) |
| 104 | [Catch Me If You Can](https://30daysofjs.netlify.app/104%20-%20Catch%20Me%20If%20You%20Can/) |
| 105 | [Word For Alphabet Speak Aloud](https://30daysofjs.netlify.app/154%20-%20Word%20For%20Alphabet%20Speak%20Aloud/) |
| 106 | [Snowy Particle Js](https://30daysofjs.netlify.app/150%20-%20Snowy%20Particle%20Js/) |
| 107 | [Stack Game](https://30daysofjs.netlify.app/134%20-%20Stack%20Game/) |
| 108 | [Maths addition](https://30daysofjs.netlify.app/108%20-%20Maths%20addition/) |
| 109 | [Number Facts](https://30daysofjs.netlify.app/145%20-%20Number%20Facts/) |
| 110 | [Pixel to em Converter](https://30daysofjs.netlify.app/110%20-%20Pixel%20to%20em%20Converter/) |
| 111 | [Luminosity Particle Js](https://30daysofjs.netlify.app/141%20-%20Luminosity%20Particle%20Js/) |
| 112 | [Maze Game](https://30daysofjs.netlify.app/112%20-%20Maze%20Game/) |
| 113 | [Minesweeper](https://30daysofjs.netlify.app/113%20-%20minesweeper/) |
| 114 | [Movie Guessing Game](https://30daysofjs.netlify.app/114%20-%20Movie%20-%20Guessing%20Game/) |
| 116 | [Shell Game](https://30daysofjs.netlify.app/116%20-%20Shell%20-%20Game/) |
| 124 | [2048 Game](https://30daysofjs.netlify.app/124%20-%202048%20Game/) |
| 125 | [Flappy Bird Game](https://30daysofjs.netlify.app/125%20-%20Flappy%20-%20Bird%20Game/) |
| 126 | [Arcade Game](https://30daysofjs.netlify.app/124%20-%Arcade48%20Game/) |
| 128 | [Largest EigenValue and EigenVector Calculator](https://30daysofjs.netlify.app/128%20-%20Eigen%20Value%20and%20Vector%20Calculator/) |

</td><td>
</td></tr></table>

Expand Down
13 changes: 13 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -1935,6 +1935,19 @@ <h4>Lights Out</h4>
<a target="_blank" href="122 - Lights Out/index.html"><i class="fa-solid fa-link"></i> </a>
</a>
</div>
<div class="item">
<img src="30DaysOfJavaScript\assets\128.png" alt="Largest EigenValue and EigenVector Calculator">
<h4>Largest EigenValue and EigenVector Calculator</h4>
<a target="_blank"
href="https://github.com/swapnilsparsh/30DaysOfJavaScript/tree/master/128%20-%20Eigen%20Value%20and%20Vector%20Calculator">
<i class="fa-brands fa-square-github"></i>
<a target="_blank" href="128 - Eigen Value and Vector Calculator/index.html"><i class="fa-solid fa-link"></i> </a>
</a>
<div class="description">
<p> Enter the dimension of matrix and insert values of the matrix. Find out Largest EigenValue and EigenVector!
</p>
</div>
</div>
</div>

<div class="item">
Expand Down

0 comments on commit 1324954

Please sign in to comment.