diff --git a/Calculators/Averages-Calculator/README.md b/Calculators/Averages-Calculator/README.md new file mode 100644 index 000000000..5319fdf37 --- /dev/null +++ b/Calculators/Averages-Calculator/README.md @@ -0,0 +1,17 @@ +# Averages Calculator + +## Overview +This is a simple web-based averages calculator that allows users to input comma-separated values and calculates the arithmetic, geometric, and harmonic means. + +## Technologies Used +- HTML +- CSS +- JavaScript + +## Features +- Input validation ensures only numerical values are accepted. +- Calculates arithmetic mean, geometric mean, and harmonic mean. +- Clean and responsive user interface. + +## Screenshots +![alt text](./assets/demo.png) \ No newline at end of file diff --git a/Calculators/Averages-Calculator/assets/demo.png b/Calculators/Averages-Calculator/assets/demo.png new file mode 100644 index 000000000..ba239e442 Binary files /dev/null and b/Calculators/Averages-Calculator/assets/demo.png differ diff --git a/Calculators/Averages-Calculator/index.html b/Calculators/Averages-Calculator/index.html new file mode 100644 index 000000000..7e30cfe07 --- /dev/null +++ b/Calculators/Averages-Calculator/index.html @@ -0,0 +1,36 @@ + + + + + + Averages Calculator + + + +
+

Averages Calculator

+
+
+ + +
+ +
+

Results

+
+ Arithmetic Mean: + - +
+
+ Geometric Mean: + - +
+
+ Harmonic Mean: + - +
+
+
+ + + diff --git a/Calculators/Averages-Calculator/script.js b/Calculators/Averages-Calculator/script.js new file mode 100644 index 000000000..001f6e323 --- /dev/null +++ b/Calculators/Averages-Calculator/script.js @@ -0,0 +1,23 @@ +document.getElementById("calculate-btn").addEventListener("click", function () { + const valuesInput = document.getElementById("values-input").value; + const numbers = valuesInput.split(",").map((num) => parseFloat(num.trim())); + + const arithmeticMean = + numbers.reduce((sum, num) => sum + num, 0) / numbers.length; + + let geometricMean = 1; + for (const num of numbers) { + geometricMean *= num; + } + geometricMean = Math.pow(geometricMean, 1 / numbers.length); + + const harmonicMean = + numbers.length / numbers.reduce((sum, num) => sum + 1 / num, 0); + + document.getElementById("arithmetic-mean").textContent = + arithmeticMean.toFixed(2); + document.getElementById("geometric-mean").textContent = + geometricMean.toFixed(2); + document.getElementById("harmonic-mean").textContent = + harmonicMean.toFixed(2); +}); diff --git a/Calculators/Averages-Calculator/style.css b/Calculators/Averages-Calculator/style.css new file mode 100644 index 000000000..fe0e7af63 --- /dev/null +++ b/Calculators/Averages-Calculator/style.css @@ -0,0 +1,53 @@ +body { + font-family: Arial, sans-serif; +} + +.container { + max-width: 600px; + margin: 0 auto; + padding: 20px; +} + +.heading { + text-align: center; +} + +.input-section { + margin-bottom: 20px; +} + +input[type="text"], +textarea { + width: 100%; + padding: 8px; + margin-top: 5px; + margin-bottom: 10px; + box-sizing: border-box; +} + +button { + display: block; + width: 100%; + padding: 10px; + background-color: #007bff; + color: white; + border: none; + cursor: pointer; +} + +button:hover { + background-color: #0056b3; +} + +.results { + margin-top: 20px; +} + +.result { + margin-bottom: 10px; +} + +.result span { + display: inline-block; + width: 150px; +} diff --git a/index.html b/index.html index aab0626e6..158cc37be 100644 --- a/index.html +++ b/index.html @@ -216,6 +216,20 @@

Calculates the aspect ratio of the specified height and width.

+
+
+

Averages Calculator

+

Calculates the arithmetic, geometric, and harmonic means.

+
+ + + + + Source Code + +
+
+

Basic Calculator