魔方图形代码

来源：互联网发布：mac usb设备已停用编辑：程序博客网时间：2024/05/16 00:56
<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title></title></head><body><div id="canvas-warp">    <canvas id="canvas"style="border:1px solid #aaaaaa;display: block;margin: 50px auto;">    </canvas></div><script>    window.onload=function(){        var canvas=document.getElementById("canvas");        canvas.width=800;        canvas.height=600;        var context=canvas.getContext("2d");        context.beginPath();        context.rect(0,0,800,600);        context.fillStyle="#AA9033";        context.fill();        context.beginPath();        for(var i=0; i<=20; i++){            drawWhiteRect(context, 200 + 10 * i, 100 + 10 * i, 400 - 20 * i, 400 - 20 * i);            drawBlackRect(context, 205 + 10 * i, 105 + 10 * i, 390 - 20 * i, 390 - 20 * i);        }        context.beginPath();        context.rect(395,295,5,5);        context.fillStyle="black";        context.lineWidth=5;        context.fill();        context.stroke();        }    function drawBlackRect(cxt,x,y,width,height){        cxt.beginPath();        cxt.rect(x,y,width,height);        cxt.lineWidth=5;        cxt.strokeStyle="black";        cxt.stroke();    }    function drawWhiteRect(cxt,x,y,width,height){        cxt.beginPath();        cxt.rect(x,y,width,height);        cxt.lineWidth=5;        cxt.strokeStyle="white";        cxt.stroke();    }</script></body></html></body></html>
0 0