Example: Tiling an image
by spring1975
HTML
<!-- Learn about this code on MDN: https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API/Tutorial/Using_images -->
<html>
<body onload="draw();">
<canvas id="canvas" width="500" height="500"></canvas>
</body>
</html>
JavaScript
function draw() {
var ctx = document.getElementById('canvas').getContext('2d');
var img = new Image();
img.onload = function() {
ctx.drawImage(img, 0, 0, 300, 300);
};
img.src = 'https://mdn.mozillademos.org/files/5397/rhino.jpg';
}