18 Temmuz 2016 Pazartesi

HTML5 CANVAS TRANSLATE İŞLEMİ


<!DOCTYPE html>
<html>
    <head>
        <style>
            canvas{

                border:1px solid #d3d3d3;
                /*    background-color: #000;*/
                canvas {
                    cursor:none;
                }
            }
        </style>
    <script>
        window.onload = function () {
            benimtuval=document.getElementById("mycanvas");
            ctx=benimtuval.getContext("2d");
           //translate scale rotate
            ctx.fillRect(0,0,150,150);
            ctx.translate(100,100);  /*yeni konum veriyor*/
            ctx.fillRect(0,0,150,150);
            ctx.strokeStyle="white";
            ctx.strokeRect(0,0,150,150);
            ctx.stroke();
            ctx.translate(100,100);
            ctx.fillRect(0,0,150,150);
       
    }


    </script>


</head>
<body>
<img id="resim" src="ari.png" style="display:none"/>
<canvas id="mycanvas" onmousemove="eylem(event)" width="600" height="400" >
        Your browser does not support the HTML5 canvas tag.</canvas>



</body>
</html>

Hiç yorum yok:

Yorum Gönder