JSFiddle - React, Tailwind, and code Playground

by replicateur

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jstat/1.9.6/jstat.min.js"></script>
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/PapaParse/5.1.0/papaparse.min.js"></script>
<div id="chartContainer" style="height: 300px; width:100%;"></div>
<button onclick="startSampling()">Reset chart</button>
<button onclick="runMultiplePulls(10)">Multiple pulls</button>
<input type="file" id="fileInput" />

CSS

input.active {
  border: 1px solid green;
}

JavaScript

var input = document.getElementById("fileInput");
var csvData = [];
var footballArms = {};
var footballArmsCount = {};
var footballRewards = {};
var footballOdds = {};
var totalCounts = {};

input.addEventListener("change", function(event) {
  var file = event.target.files[0];
  Papa.parse(file, {
    header: true,
    complete: function(results) {
      input.classList.add("active");
      parseResult(results.data);
      startSampling();
    }
  });
});

function parseResult(results) {
  results.forEach((v, i) => {
    const matchData = {
      "Type": v.Type,
      "Day": v.Day,
      "HomeTeam": v.HomeTeam,
      "AwayTeam": v.AwayTeam,
      "FTHG": v.FTHG,
      "FTAG": v.FTAG,
      "FTR": v.FTR,
      "Date": v.Date,
      "B365H": v.B365H,
      "B365D": v.B365D,
      "B365A": v.B365A,
    }
    if (v.HomeTeam != null && v.Day <= 19) {
      if (footballArms[v.HomeTeam] == null) {
        footballArms[v.HomeTeam] = 0;
        footballArmsCount[v.HomeTeam] = 0;
        footballOdds[v.HomeTeam] = [];
      }
      if (footballArms[v.AwayTeam] == null) {
        footballArms[v.AwayTeam] = 0;
        footballArmsCount[v.AwayTeam] = 0;
        footballOdds[v.AwayTeam] = [];
      }
      if (footballRewards[v.HomeTeam] == null) {
        footballRewards[v.HomeTeam] = [];
      }
      if (footballRewards[v.AwayTeam] == null) {
        footballRewards[v.AwayTeam] = [];
      }
      const homeReward = v.FTR > "0" ? 1 : 0;
      footballRewards[v.HomeTeam].push(homeReward);

      const awayReward = v.FTR < "0" ? 1 : 0;
      footballRewards[v.AwayTeam].push(awayReward);

      footballOdds[v.HomeTeam].push(v.B365H);
      footballOdds[v.AwayTeam].push(v.B365A);
    }
  });
}

function isEarlierThan(dateString, dateLimit) {
  var referenceDate = new Date(dateLimit);
  var parts = dateString.split("/");
  var date = new Date(parts[2], parts[1] - 1, parts[0]);
  return date < referenceDate;
}

class GraphChart {
  constructor(config) {
    this.lines =...