                        課程
                    
                        /前端開發(fā)
                        
                            /Html5
                        
                        /Canvas繪圖詳解

按老師照抄，為何不顯示，各位大神幫看一看

<!DOCTYPE html>
<html>
<head>
??? <meta charset="UTF-8">
??? <title></title>
</head>
<body>
??? <canvas id="canvas" style ="divplay:black;margin:0 auto;border:1px solid #aaa;">
??????? 當前瀏覽器不支持Canvas，請更換瀏覽器后再試
??? </canvas>
<script>
??? window.onload = function(){
??? var canvas=document.getElementById('canvas');
?? ?
??? canvas.width=800;
??? canvas.height=800;
??? var ctx=canvas.getContext("2d");
??? drawRoundRect(context,100,100,600,500,50);? ?
??? }

?function drawRoundRect(cxt,x,y,width,height,r,) {
?
??????? cxt.save();
??????? cxt.translate(x, y);
??????? pathRoundRect(cxt,width,height,r);
??????? cxt.strokeStyle ="black";
??????? cxt.stroke();
??????? cxt.restore();
??? }
?
function pathRoundRect(cxt,width,height,r) {
??????? cxt.beginPath();
?? ??? ?cxt.arc(width-r,heigh r, r, 0,Math.PI/2 );
??????? cxt.lineTo(r, height);
??????? cxt.arc(r, height-r, r, Math.PI/2, Math.PI);
??????? cxt.lineTo(0,r);
??????? cxt.arc(r, r, r, r.Math.PI, Math.PI*3/2);
??????? cxt.lineTo(width-r, 0);
??????? cxt.arc(width-r, r, r, Math.PI*3/2, Math.PI*2);
??????? cxt.closePath();
??? }
</script>?? ?
</body>
</html>