bullet-fide.html

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <script src="https://cdn.plot.ly/plotly-1.2.0.min.js"></script>
</head>

<body>
  <div id="chart" style="width:100vw;height:100vh;"></div>
</body>

<script type="text/javascript" src="ratings.js"></script>
<script>
  let bullet = [];
  let fide = [];

  for (const el of ratings[0]) {
    bullet.push(el[0]);
    fide.push(el[1]);
  }

  chart = document.getElementById('chart');

  const trace = {
    x: bullet,
    y: fide,
    mode: 'markers',
    type: 'scatter'
  }

  var layout = {
    title: 'FIDE rating vs Lichess bullet rating',
    xaxis: {
      title: 'Lichess bullet Rating'
    },
    yaxis: {
      title: 'FIDE rating'
    }
  };

	Plotly.newPlot('chart', [trace], layout);
</script>

<style>
  * {
    margin: 0;
  }
</style>

</html>