HTML5: Vẽ ảnh trên <canvas>

Các khóa học qua video:
Python SQL Server PHP C# Lập trình C Java HTML5-CSS3-JavaScript
Học trên YouTube <76K/tháng. Đăng ký Hội viên
Viết nhanh hơn - Học tốt hơn
Giải phóng thời gian, khai phóng năng lực

Để vẽ ảnh trên canvas bạn sử dụng phương thức sau:

Ø  drawImage(image,x,y)

Ví dụ:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

</head>

<body>

<p>Image to use:</p>

<img id="scream" src="nguồn_ảnh" alt="The Scream" width="220" height="277">

<p>Canvas:</p>

<canvas id="myCanvas" width="200" height="100" style="border:1px solid #d3d3d3;">

Trình duyệt này không hỗ trợ phần tử canvas.

</canvas>

<script>

var c=document.getElementById("myCanvas");

var ctx=c.getContext("2d");

var img=document.getElementById("scream");

ctx.drawImage(img,10,10);

</script>

</body>

</html>

» Tiếp: Gradient với <canvas>
« Trước: Vẽ chữ bằng <canvas>
Các khóa học qua video:
Python SQL Server PHP C# Lập trình C Java HTML5-CSS3-JavaScript
Học trên YouTube <76K/tháng. Đăng ký Hội viên
Viết nhanh hơn - Học tốt hơn
Giải phóng thời gian, khai phóng năng lực
Copied !!!