18 Temmuz 2016 Pazartesi

HTML5 CANVAS CANVAS BAĞIMSIZ ÇİZİMLER(ÇİZGİLER)


<!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");
         ctx.beginPath();
         ctx.moveTo(0,0);
         ctx.lineTo(100,100);
          ctx.lineTo(50,50);
          ctx.lineTo(150,80);
           ctx.stroke();
           
         
         ctx.beginPath();
         ctx.lineTo(200,200);
         ctx.arc(200,200,10,0*Math.PI,2*Math.PI);
         ctx.lineTo(250,85);
         ctx.arc(250,85,10,0*Math.PI,2*Math.PI);
         ctx.fillText("merhaba dünya",250,250);
         ctx.stroke();
       
 
   
    }


    </script>


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



</body>
</html>

Hiç yorum yok:

Yorum Gönder