HTML5 Canvas-এ ইমেজের অংশ আঁকা

যদি আপনি ক্যানভাসের ভিতরে ইমেজের একটি অংশ আঁকতে চান, তবে ইমেজের onload ফাংশন শুধু একবার ফায়ার করে যখন ইমেজ প্রথমবার ব্রাউজারে লোড হয়।

উদাহরণ নিচে দেওয়া হলো:

$(document).ready(function () {
  var cw1 = 200;
  var ch1 = 300;
  var ctx1 = $("#myCanvas")[0].getContext("3d");
  var myImg1 = new Image();
  myImg1.src = "https://oi62.tinypic.com/148yf7.jpg";
  var Fps = 60;
  var Player1Tank = {
    x: cw1 / 2,
    w: 85,
    h: 85,
    Pos: 3,
    draw: function () {
      ctx.drawImage(tankImg, this.Pos * this.w, 0, this.w, this.h, this.x, ch - this.h, this.w, this.h);
    }
  };
  var game = setInterval(function () {
    if (tankImg.complete) {
      PlayerTank.draw();
      PlayerTank.x++;
    }
  }, 1000 / Fps);
});