Poisson-Rechner fuer Fussball-Ergebnisse

HTML

<div class="container">
  <h2>Poisson-Ergebnis-Rechner</h2>
  <p>
    Geben Sie die erwarteten Tore (z. B. aus den Quoten abgeleitet) für beide
    Teams ein:
  </p>

  <div class="inputs">
    <div class="input-group">
      <label for="homeExpected">Erwartete Tore Heimteam (λ):</label>
      <input type="number" id="homeExpected" step="0.1" value="1.6" min="0" />
    </div>
    <div class="input-group">
      <label for="awayExpected">Erwartete Tore Auswärtsteam (λ):</label>
      <input type="number" id="awayExpected" step="0.1" value="1.2" min="0" />
    </div>
  </div>

  <button onclick="calculatePoisson()">Ergebnisse berechnen</button>

  <h3>Wahrscheinlichkeiten für exakte Ergebnisse (in %)</h3>
  <table id="resultTable">
    <!-- Tabelle wird per JavaScript befüllt -->
  </table>
</div>

CSS

body {
  font-family: Arial, sans-serif;
  margin: 20px;
  background-color: #f4f4f9;
  color: #333;
}
.container {
  max-width: 800px;
  margin: 0 auto;
  background: white;
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.inputs {
  display: flex;
  gap: 20px;
  margin-bottom: 20px;
}
.input-group {
  flex: 1;
  display: flex;
  flex-direction: column;
}
label {
  font-weight: bold;
  margin-bottom: 5px;
}
input {
  padding: 8px;
  font-size: 16px;
  border: 1px solid #ccc;
  border-radius: 4px;
}
button {
  padding: 10px;
  background-color: #007bff;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 16px;
  font-weight: bold;
}
button:hover {
  background-color: #0056b3;
}
table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 20px;
}
th,
td {
  border: 1px solid #ddd;
  padding: 10px;
  text-align: center;
}
th {
  background-color: #f2f2f2;
}
.highlight {
  background-color: #e2f0d9;
  font-weight: bold;
}

JavaScript

// Fakultät-Funktion (x!)
function factorial(n) {
  if (n === 0 || n === 1) return 1;
  let result = 1;
  for (let i = 2; i <= n; i++) {
    result *= i;
  }
  return result;
}

// Poisson-Formel: (lambda^x * e^-lambda) / x!
function poisson(x, lambda) {
  return (Math.pow(lambda, x) * Math.exp(-lambda)) / factorial(x);
}

function calculatePoisson() {
  const homeLambda = parseFloat(document.getElementById('homeExpected').value);
  const awayLambda = parseFloat(document.getElementById('awayExpected').value);

  if (
    isNaN(homeLambda) ||
    isNaN(awayLambda) ||
    homeLambda < 0 ||
    awayLambda < 0
  ) {
    alert('Bitte geben Sie gültige positive Zahlen ein.');
    return;
  }

  const table = document.getElementById('resultTable');
  table.innerHTML = ''; // Tabelle zurücksetzen

  // Tabellenkopf erstellen (Tore Auswärtsteam)
  let headerRow = '<tr><th>Heim \\ Auswärts</th>';
  for (let awayGoals = 0; awayGoals <= 4; awayGoals++) {
    headerRow += `<th>${awayGoals} Tor(e)</th>`;
  }
  headerRow += '</tr>';
  table.innerHTML += headerRow;

  let highestProb = 0;
  let bestHome = 0;
  let bestAway = 0;
  let matrix = [];

  // Matrix berechnen und das wahrscheinlichste Ergebnis finden
  for (let homeGoals = 0; homeGoals <= 4; homeGoals++) {
    matrix[homeGoals] = [];
    let homeProb = poisson(homeGoals, homeLambda);

    for (let awayGoals = 0; awayGoals <= 4; awayGoals++) {
      let awayProb = poisson(awayGoals, awayLambda);
      let combinedProb = homeProb * awayProb * 100; // In Prozent

      matrix[homeGoals][awayGoals] = combinedProb;

      if (combinedProb > highestProb) {
        highestProb = combinedProb;
        bestHome = homeGoals;
        bestAway = awayGoals;
      }
    }
  }

  // Tabelle im HTML aufbauen
  for (let homeGoals = 0; homeGoals <= 4; homeGoals++) {
    let row = `<tr><td><strong>${homeGoals} Tor(e)</strong></td>`;

    for (let awayGoals = 0; awayGoals...