CHAPTER 2
function draw2mid() { Start draw2mid function
var dotx; Variable to be used for the horizontal position for
drawing the two dots
var doty; Variable to be used for the vertical position for
drawing the two dots
ctx.beginPath(); Begin path
dotx = dicex + 3*dotrad; Position the dots to be just inside horizontally
doty = dicey + .5*diceheight; And midway vertically
ctx.arc(dotx,doty,dotrad,0,Math.
PI*2,true);
Construct circle
dotx = dicex+dicewidth-3*dotrad; Position this dot to be just inside the right border
doty = dicey + .5*diceheight; //no change Position y midway
ctx.arc(dotx,doty,dotrad,0,Math.
PI*2,true);
Construct circle
ctx.closePath(); Close path
ctx.fill(); Draw dots
} Close draw2mid function
Close script element
Close head element
Starting body tag, with onLoad attribute set to
invoke the init() function
<canvas id="canvas" width="400"
height="300">
Your browser doesn't support the HTML5
element canvas.
Set up canvas and provide notice if browser
doesnt accept canvas element