function sleep(ms) {
        return new Promise(resolve => setTimeout(resolve, ms));
}

var pi_string = '3.14159265358979323846264338327950288419716939937510582097494459230781640628620899862803482534211706798214808651328230664709384460955058223172535940812848111745028410270193852110555964462294895493038196442881097566593344612847564823378678316527120190914564856692346034861045432664821339360726024914127372458700660631558817488152092096282925409171536436789259036001133053054882046652138414695194151160943305727036575959195309218611738193261179310511854807446237996274956735188575272489122793818301194912983367336244065664308602139494639522473719070217986094370277053921717629317675238467481846766940513200056812714526356082778577134275778960917363717872146844090122495343014654958537105079227968925892354201995611212902196086403441815981362977477130996051870721134999999837297804995105973173281609631859502445945534690830264252230825334468503526'

async function draw() {
  var elem = document.getElementById("canvas");
  var ctx = elem.getContext("2d"); // These 2 lines let us connect to the Canvas
  
  for (i = 0; i < pi_string.length; i++) {
    ctx.font = "##px Lucida Sans Unicode".replace("##", Math.random()*64+64);
    ctx.fillStyle = "rgb(" + Math.random()*255 + "," + Math.random()*255 + "," + Math.random()*255 + ")";
    ctx.fillText(pi_string[i], Math.random()*600, Math.random()*600); // Here we write the first digit
    await sleep(100);
  }
}