This time I'm planning a single square canvas (id=c) of side 75vmin. The grid will be 800x800 so g_step=g_side/800. Try setting this up yourself before clicking here to reveal my work.

<html>
<head>
  <title>Turtle Graphics</title>
  <link rel='stylesheet' href='styles.css'>
  <script src='globals.js'></script>
  <script src='my.js'></script>
</head>
<body onResize='resize();'>
  <canvas id='c'></canvas>
  <script>setup(); test();</script>
</body>
</html>
function resize() {
  var side=75*vmin();
  if (side!=g_side) setup();
}
function setup() {
  g_side=75*vmin();
  var canvas=document.getElementById('c');
  canvas.width=g_side; canvas.height=g_side;
  g_ctx=canvas.getContext('2d');
  g_step=g_side/800;
  home();
}