큐브 그래픽 코드

7991 단어 code
/span>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>

좋은 웹페이지 즐겨찾기