<body>
<canvas id="my-canvas" width="300" height=”300"></canvas>
</body>
const canvas = document.getElementById('my-canvas');
const context = canvas.getContext('2d');
Vẽ đường thẳng
context.beginPath();
context.moveTo(50, 50);
context.lineTo(250, 150);
context.strokeStyle='red';
context.stroke();
Vẽ hình chữ nhật
context.fillStyle = 'red';
context.fillRect(x, y, width, height);
Vẽ hình tròn
context.beginPath();
context.arc(100, 100, 50, 0, 2*Math.PI);
context.stroke();
Vẽ Text
context.fillStyle='red';
context.font='30px Arial';
context.fillText('Hello World',20,50,200);
Ve anh
const background= new Image();
background.src ='images/bg.png';
context.drawImage(background, 0, 0);
trong game loop sử dụng
requestAnimationFrame(update);
requestAnimationFrame(update);
No comments:
Post a Comment