HTML and CSS Reference
In-Depth Information
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
</script>
Close
script
element
</head>
Close
head
element
<body onLoad="init();">
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.
</canvas>
Set up canvas and provide notice if browser
doesnt accept
canvas
element
</body>
</html>
Close
body
and close
html
elements.
