Poisson-Rechner (Optionales Unentschieden)

HTML

<div class="container">
  <h2>Fußball-Prognose (Flexibles Remis)</h2>
  <p>
    Wählen Sie aus, ob ein Unentschieden in die Berechnung einfließen soll (z.B.
    reguläre Ligaspiele vs. K.o.-Phasen ohne Remis).
  </p>

  <div class="grid-inputs">
    <div class="input-group">
      <label for="drawStatus">Unentschieden möglich?</label>
      <select id="drawStatus" onchange="toggleDrawInput()">
        <option value="yes" selected>Ja (Reguläre Spielzeit)</option>
        <option value="no">Nein (K.o.-Spiel / Draw No Bet)</option>
      </select>
    </div>
    <div class="input-group">
      <label for="quoteHome">Quote Heimsieg (1):</label>
      <input type="number" id="quoteHome" step="0.01" value="1.50" min="1.01" />
    </div>
    <div class="input-group" id="drawInputGroup">
      <label for="quoteDraw">Quote Unentschieden (X):</label>
      <input type="number" id="quoteDraw" step="0.01" value="4.30" min="1.01" />
    </div>
    <div class="input-group">
      <label for="quoteAway">Quote Auswärtssieg (2):</label>
      <input type="number" id="quoteAway" step="0.01" value="7.00" min="1.01" />
    </div>
    <div class="input-group">
      <label for="totalGoals">Erwartete Gesamttore:</label>
      <select id="totalGoals">
        <option value="2.0">2.0 Tore (Defensiv)</option>
        <option value="2.5" selected>2.5 Tore (Schnitt)</option>
        <option value="2.8">2.8 Tore (Leicht offensiv)</option>
        <option value="3.2">3.2 Tore (Torreich)</option>
      </select>
    </div>
  </div>

  <button onclick="calculateFromQuotes()">Berechnen & Analysieren</button>

  <h3 class="section-title">Berechnete Zwischenwerte</h3>
  <div class="info-box">
    <div>
      <strong>Bereinigte Wahrscheinlichkeiten:</strong>
      <ul>
        <li>Heimsieg: <span id="fairHomeProb">0</span>%</li>
        <li id="fairDrawLi">
          Unentschieden: <span id="fairDrawProb">0</span>%
        </li>
       ...

CSS

body {
  font-family: Arial, sans-serif;
  margin: 20px;
  background-color: #f4f4f9;
  color: #333;
}
.container {
  max-width: 900px;
  margin: 0 auto;
  background: white;
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.section-title {
  border-bottom: 2px solid #007bff;
  padding-bottom: 5px;
  margin-top: 25px;
  color: #007bff;
}
.grid-inputs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 15px;
  margin-bottom: 20px;
}
.input-group {
  display: flex;
  flex-direction: column;
}
label {
  font-weight: bold;
  margin-bottom: 5px;
  font-size: 14px;
}
input,
select {
  padding: 8px;
  font-size: 16px;
  border: 1px solid #ccc;
  border-radius: 4px;
}
button {
  width: 100%;
  padding: 12px;
  background-color: #007bff;
  color: white;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-size: 16px;
  font-weight: bold;
  margin-top: 10px;
}
button:hover {
  background-color: #0056b3;
}
.info-box {
  background-color: #e9ecef;
  padding: 15px;
  border-radius: 6px;
  margin-top: 20px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 15px;
}
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;
  color: #2e7d32;
}
.hidden {
  display: none !important;
}

JavaScript

// Blendet das Unentschieden-Eingabefeld dynamisch ein/aus
function toggleDrawInput() {
  const drawStatus = document.getElementById('drawStatus').value;
  const drawGroup = document.getElementById('drawInputGroup');
  const fairDrawLi = document.getElementById('fairDrawLi');

  if (drawStatus === 'no') {
    drawGroup.classList.add('hidden');
    fairDrawLi.classList.add('hidden');
  } else {
    drawGroup.classList.remove('hidden');
    fairDrawLi.classList.remove('hidden');
  }
  calculateFromQuotes();
}

function factorial(n) {
  if (n === 0 || n === 1) return 1;
  let result = 1;
  for (let i = 2; i <= n; i++) result *= i;
  return result;
}

function poisson(x, lambda) {
  return (Math.pow(lambda, x) * Math.exp(-lambda)) / factorial(x);
}

function calculateFromQuotes() {
  // STEUERUNGS-VARIABLE: Hier können Sie das maximale Limit jederzeit anpassen
  const MAX_GOALS = 6;

  const drawStatus = document.getElementById('drawStatus').value;
  const qHome = parseFloat(document.getElementById('quoteHome').value);
  const qAway = parseFloat(document.getElementById('quoteAway').value);
  const totalGoalsExp = parseFloat(document.getElementById('totalGoals').value);

  let qDraw = 1;
  if (drawStatus === 'yes') {
    qDraw = parseFloat(document.getElementById('quoteDraw').value);
    if (isNaN(qDraw) || qDraw <= 1) {
      alert('Bitte geben Sie eine gültige Unentschieden-Quote ein.');
      return;
    }
  }

  if (isNaN(qHome) || isNaN(qAway) || qHome <= 1 || qAway <= 1) {
    alert('Bitte geben Sie gültige Quoten größer als 1.00 ein.');
    return;
  }

  // Implizierte Wahrscheinlichkeiten
  const rawHome = 100 / qHome;
  const rawAway = 100 / qAway;
  const rawDraw = drawStatus === 'yes' ? 100 / qDraw : 0;

  const totalRaw = rawHome + rawAway + rawDraw;

  // Faire Wahrscheinlichkeiten berechnen
  const fairHome = (rawHome / totalRaw) * 100;
  const fairAway = (rawAway / totalRaw) * 100;
  const...