Let's make a function to draw the circle and then draw some circles in the Canvas. We are going to put code in different files to make the code simpler:
Open the
untangle.drawing.jsfile in our code editor and put in the following code:if (untangleGame === undefined) { var untangleGame = {}; } untangleGame.drawCircle = function(x, y, radius) { var ctx = untangleGame.ctx; ctx.fillStyle = "GOLD"; ctx.beginPath(); ctx.arc(x, y, radius, 0, Math.PI*2, true); ctx.closePath(); ctx.fill(); };Open the
untangle.data.jsfile and put the following code into it:if (untangleGame === undefined) { var untangleGame = {}; } untangleGame.createRandomCircles = function(width, height) { // randomly draw 5 circles var circlesCount = 5; var circleRadius = 10; for (var i=0;i<circlesCount;i++) { var x = Math.random()*width; var y = Math.random()*height; untangleGame.drawCircle(x, y, circleRadius); } };Then...