কম্পিউটার টিউটোরিয়াল

HTML5 drawImage() মেথড ক্যানভাসে ইমেজ আঁকতে

ক্যানভাসে ইমেজ আঁকতে, HTML5 drawImage() মেথড ব্যবহার করুন:

<!DOCTYPE HTML> <html>    <head>       <script>          function drawShape(){             // DOM ব্যবহার করে ক্যানভাস এলিমেন্ট পান             var canvas = document.getElementById('mycanvas');                       // নিশ্চিত করুন যে ক্যানভাস সমর্থিত না হলে এক্সিকিউট করা হয় না             if (canvas.getContext){                // getContext ব্যবহার করে ক্যানভাসে আঁকুন                var ctx = canvas.getContext('2d');                // শেপ আঁকুন                var img = new Image();                img.src = '/images/backdrop.jpg';                img.onload = function(){                   ctx.drawImage(img,0,0);                   ctx.beginPath();                   ctx.moveTo(30,96);                   ctx.lineTo(70,66);                   ctx.lineTo(103,76);                   ctx.lineTo(170,15);                   ctx.stroke();                }             } else {                alert('You need Safari or Firefox 1.5+ to see this demo.');             }          }       </script>    </head>    <body onload = "drawShape();">       <canvas id = "mycanvas"></canvas>    </body> </html>

  1. HTML5 Canvas-এ রেখা কীভাবে আঁকবেন?

  2. HTML5 Canvas-এ বেজিয়ার কর্ভ কীভাবে আঁকবেন?

  3. HTML5 Canvas-এ আয়তক্ষেত্র কীভাবে আঁকবেন?

  4. HTML5 Canvas-এ তারকা কীভাবে আঁকবেন?